Question

因此，我正在编写一个非常简单的应用程序，只是为了了解有关flutter的提供程序包的更多信息。该应用程序是这样的：

当我在mi TextField中编写代码时，它下面的文本应该更改并且标题应该保持不变，但是我无法让它侦听来自changeText方法的更改。代码是

import 'package:flutter/material.dart';
import 'package:provider/provider.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return ChangeNotifierProvider<Data>(
      create: (context) => Data(),
      child: MaterialApp(
        home: Scaffold(
          appBar: AppBar(
            title: MyText(),
          ),
          body: Container(
            child: Level1(),
          ),
        ),
      ),
    );
  }
}

class Level1 extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Container(
      child: Level2(),
    );
  }
}

class Level2 extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Container(
      child: Column(
        children: <Widget>[
          MyTextField(),
          Level3(),
        ],
      ),
    );
  }
}

class Level3 extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Text(Provider.of<Data>(context, listen: false).data);
  }
}

class MyText extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Text(context.watch<Data>().data);
  }
}

class MyTextField extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return TextField(
      onChanged: (newText) {
        Provider.of<Data>(context).changeText(newText);
        print(newText);
      },
    );
  }
}

class Data extends ChangeNotifier {
  String data = 'Hello';

  void changeText(String newString) {
    data = newString;
    print('Hello $data');
    notifyListeners();
  }
}

Answer 1

尝试将TextField小部件放入有状态小部件内。

    return TextField(
      onChanged: (newText) {
        Provider.of<Data>(context).changeText(newText);
        print(newText);
      },
    );

将其包含在有状态的小部件中

此外，您还必须将Text控制器添加到textfield小部件，然后在flutter中转到docs for textfield小部件。

为什么我不能让提供程序包收听更改？

1 个答案: