Flutter 监听来自其他小部件的 textField 值变化答案

【问题标题】：Flutter listening to textField value changes from other widgetFlutter 监听来自其他小部件的 textField 值变化
【发布时间】：2018-12-11 05:27:54
【问题描述】：

下面是一个对话框，通过使用文本字段和按钮来捕获用户输入。当 textField 为空时，该按钮被禁用，但是当 textField 被填充值时，它继续被禁用。这是因为 _textController.text 状态没有被更新（在这个小部件中再次呈现）。

void _pushAdd() async {
await showDialog(
  context: this.context,
  builder: (BuildContext context) {
    return AlertDialog(
      title: Text('Add a custom word'),
      content: _renderForm(),
      actions: <Widget>[
        FlatButton(
          child: Text('ADD'),
          onPressed: (_textController.text.isNotEmpty) ? () =>  _addNewPair() : null,
        ),
      ],
    );
  },
);
// Changed _pushAdd as async to handle onClose and clear _textController upon exit
_textController.clear();

目前 _textController 是在顶部的类中启动的（不是 init）。

var _textController = new TextEditingController();

带有 _textController 的 textField 位于此处：

Widget _renderForm() {
return Container(
  height: 50.0,
  child: Column(
    crossAxisAlignment: CrossAxisAlignment.start,
    children: [
      TextField(
        autofocus: true,
        textCapitalization: TextCapitalization.words,
        controller: _textController,
        decoration: InputDecoration(
          hintText: 'RedPotato',
        ),
      ),
    ]
  )
);

}

我最初的计划是使用 onChanged: + 另一种存储文本的状态。但是，我怀疑这样做是否有效。 所以我问，实时处理 TextField 值以便其他 Widget 可以监听更改的标准方法是什么？

【问题讨论】：

标签： dart flutter

【解决方案1】：

您只需收听TextEditingController 即可了解文本更改。

      var _textController = TextEditingController();

      @override
      void dispose() {
        // Clean up the controller when the Widget is disposed
        _textController.dispose();
        super.dispose();
      }

      @override
      void initState() {
        _textController.addListener((){
            //here you have the changes of your textfield
            print("value: ${_textController.text}");
            //use setState to rebuild the widget
            setState(() {

                    });
        });
        super.initState();
      }

欲了解更多信息，请查看此链接：https://flutter.io/docs/cookbook/forms/retrieve-input

【讨论】：

你是天使先生 :) 非常感谢所有的帮助！该文档看起来很完美。
不客气，别忘了查看这里的所有文档：flutter.io/docs，有很多信息
抱歉澄清一下，我必须创建一个状态变量来存储文本？所以 _textController 和 .text 本身不能像状态一样更新？
是的，你可以使用 AnimatedBuilder 和 ValueNotifier
谢谢！最后，我使用了更具可读性的 ValueListenableBuilder/ValueNotifier 组合，它就像一个魅力。

【解决方案2】：

如果您使用的是 Flutter 的 Dialog 而不是特定的小部件（如本例），下面的链接很有帮助。

https://www.didierboelens.com/2018/05/hint-5-how-to-refresh-the-content-of-a-dialog-via-setstate/

【讨论】：