Flutter开发货币转换器点击按钮修改变量后UI未刷新如何解决？

问题原因 #

Flutter采用声明式渲染逻辑，仅修改变量值不会触发页面重绘，必须调用setState方法通知框架状态已发生变更，框架才会重新执行build方法更新对应UI元素。

解决方案 #

1. 首先确认你的页面继承自StatefulWidget，只有StatefulWidget的State类可以调用setState方法触发重绘。
2. 修改按钮的onPressed回调逻辑，将修改converted变量的逻辑包裹在setState内，修改后代码如下：

onPressed: () {
  if (_formKey.currentState.validate()) {
    setState(() {
      converted = convertEuro(montant);
    });
  }
},

3. 注意要将converted变量定义在State类的成员位置，不要定义在build方法内部，否则每次页面重绘时变量会被重置为初始值0。

修改完成后点击转换按钮，页面上的转换结果就会同步更新。

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