面试题：Flutter有状态Widget的状态更新机制

调用setState方法：

在有状态Widget的类中调用setState方法。setState是State类的方法。例如：

class MyStatefulWidget extends StatefulWidget {
  @override
  _MyStatefulWidgetState createState() => _MyStatefulWidgetState();
}

class _MyStatefulWidgetState extends State<MyStatefulWidget> {
  int count = 0;
  void increment() {
    setState(() {
      count++;
    });
  }
  @override
  Widget build(BuildContext context) {
    return RaisedButton(
      onPressed: increment,
      child: Text('Count: $count'),
    );
  }
}

State.setState内部流程：
- setState方法会调用_element.markNeedsBuild()。这里的_element是指与该State对象关联的Element对象。Element类在Flutter的渲染树中起着重要作用，它将Widget和渲染对象联系起来。
- markNeedsBuild方法会将该Element标记为需要重建。
重建流程：
- 当Flutter的调度循环检测到有Element标记为需要重建时，会调用该Element的build方法。
- 对于有状态Widget对应的Element，其build方法会调用State对象的build方法（也就是我们在代码中编写的build方法）。
- 在build方法中，会重新构建Widget树，Flutter会根据新的状态（例如上述例子中count增加后的状态）来生成新的Widget实例。
- 然后Flutter的渲染机制会对比新旧Widget树，通过Diff算法高效地更新实际渲染的部分，减少不必要的重绘，最终将更新后的界面显示出来。

主要涉及的类：

State：包含setState方法，管理有状态Widget的状态。
Element：连接Widget和渲染对象，在状态更新时标记自身需要重建。

主要涉及的方法：

State.setState：触发状态更新流程。
Element.markNeedsBuild：标记Element需要重建。
State.build和Element.build：用于重新构建Widget树。

星途面试题库

面试题：Flutter有状态Widget的状态更新机制

知识考点

面试题答案