Flutter改变状态变量是否必须写在setState回调详解

正文

我们都知道 setState(VoidCallback fn) 是这样用的：

setState(() {
  count++;
});

执行完后组件会重新 build()，就可以取到 count 的最新值了。但其实这样写也是一样的：

count++;
setState(() {});

因为 setState() 最后会调用 markNeedsBuild()，Flutter 会调度使组件 rebuild，所以状态变量的改变不是必须写在 setState() 的回调里面，只需要最后执行一下 setState() 也可以达到刷新界面的效果。

那为什么 Flutter 要设计 setState() 有个回调函数呢？有两个原因：

一是 setState() 的状态更新是同步的，如果你在 fn 里返回了一个 Future 去改变状态的值，setState 内部的断言会提示你不要这样做，应该在 Future 完成后在同步代码里去调用 setState 改变状态。

二是为了代码可维护性考虑。试想一下随着业务代码的迭代，可能会有很多状态变量会发生改变，比如一开始只有状态变量 a，后来加入了状态变量 b 和 c，代码变成这样：

a++;
b++;
c++;
setState(() {});

当后续业务发生变化这些状态变量都不需要了，后面维护的童鞋把这些状态变量都删除了。因为大家通常都只关注改自己的代码，会有可能忘记删除最后的 setState，代码就变成了这样：

// a++;
// b++;
// c++;
setState(() {});

这样就造成了不必要的 rebuild 浪费。所以综上所述，特别是考虑到代码的维护性，我们都应该把状态变量的改变放到 setState 的回调里面。