使用Flutter Provider包的notifyListeners时，TextField输入内容后UI不更新的问题求助

嘿，我找到你代码里导致TextField输入时UI不更新的问题啦，咱们来一步步解决：

问题根源 #

在你的MyTextField组件的onChanged回调里，你用了Provider.of<Data>(context, listen: true)来获取状态实例并调用changeString方法。这里的listen: true是问题关键：

• listen: true会让MyTextField监听Data的状态变化，每次调用notifyListeners()时，这个组件都会被重建
• 这种不必要的重建会干扰TextField的输入流程，导致UI更新异常，甚至可能丢失输入焦点

修复代码 #

只需要把MyTextField中Provider.of的listen参数改为false就行——因为这里我们只需要修改状态，不需要监听状态变化来更新这个组件的UI：

class MyTextField extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Container(
      child: TextField(
        onChanged: (newValue) {
          // 此处将listen设为false，仅获取实例修改状态
          Provider.of<Data>(context, listen: false).changeString(newValue);
        },
      ),
    );
  }
}

额外优化建议 #

你其他组件（MyAppBar、MyTextWidget）里的listen: true是合理的，因为它们需要监听状态变化来更新UI。不过listen的默认值就是true，所以可以省略这个参数，让代码更简洁：

比如MyTextWidget可以简化为：

class MyTextWidget extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Container(
      child: Text(Provider.of<Data>(context).appName),
    );
  }
}

这样修改后，当你在TextField输入文本时，appName会被更新，notifyListeners()触发后，MyAppBar和MyTextWidget会自动重建，UI就能跟着输入内容实时更新啦！

内容的提问来源于stack exchange，提问作者Aditya Komawar