Flutter实战-StatefulWidget
用了两年的flutter，有了一些心得，从今天开始陆续更新一些案例，不虚头巴脑，只求实战有用，以供学习或使用flutter的小伙伴参考，学习尚浅，如有不正确的地方还望各路大神指正，以免误人子弟，在此拜谢~（原创不易，转发请标注来源和作者
注意：无特殊说明，flutter版本为3.0+
Widget：组件，这个概念可以说在大前端开发中随处可见，非常容易理解，那么在Flutter中Widget有着广泛的概念，可以说几乎所有的对象都是Widget（万物皆Widget也是Flutter 的核心设计思想），Flutter也是通过Widget嵌套来构建ui的，这也是很多人吐糟Flutter的地方，哈哈~
一。Widget
先看官方解释
/// Describes the configuration for an [Element].
Widget就是Element 的配置信息，这里引出了另一个重要概念Element。那么Element（元素）又是什么呢，官方解释如下：
/// An instantiation of a [Widget] at a particular location in the tree.
字面意思就是Element是Widget的实例。这里涉及到tree，那就不得不提及Flutter 的”三棵树“：Widgets 树，Element树和Render树（渲染树）。Widgets 树生成Element树，Element树生成Render树，这也是Flutter的渲染流程，在此文中我们先不对Flutter的渲染流程做过多的探究，先明白Widget的概念就好。
二。StatelessWidget和StatefulWidget
三。StatefulWidget使用
1. 根据接口api刷新数据
@override
void initState() {
Api.getRelation(id).then((v) {
setState(() {
data = v;
});
});
super.initState();
}
...
static ScaffoldState of(BuildContext context) {
assert(context != null);
final ScaffoldState? result = context.findAncestorStateOfType();
if (result != null)
return result;...
比如我们要调用Scaffold的openDraw() 打开侧滑抽屉，就可以使用Scaffold.of(context) 获取State
Scaffold.of(context).openDrawer()
我们再实际开发中也可以仿照这样的方式
方式二：通过GlobalKey获取state
这种方式也是我们的常用方式，跟vue中key的使用概念是一样的，不过Globalkey的开销相对较大，尽可能尽量少用
final GlobalKey
_globalKey = GlobalKey(); ...
_globalKey.currentState.function();
方式三：将state直接暴露出去
这个作者比较经常用，觉得挺方便的。比如需要自定义可变头部组件，然后可以在头部组件调用state的方法
class EditView extends StatefulWidget {
// 可以自定义传入的头部
final dynamic mainItem;
...
@override
Widget build(BuildContext context) {
return Column(children:[widget.mainItem(this); //将state暴露出去
])
....
void xxFunction(){
}
在使用的时候 就可以把state传入到头部组件，在mainItem组件调用EditWidget的内部方法xxFunction()。
EditView(
mainItem:(state)=>widget1(state)
)
widget1（state）{
state.xxFunction()
}
3. 在组件加载完成后调用方法
WidgetsBinding 这个我们在之前的文章有提到过，
/// Schedule a callback for the end of this frame.
.....
/// * [scheduleFrameCallback], which registers a callback for the start of
/// the next frame.
在下一帧开始之前调用 了该方法，可以像如下使用：
@override
void initState() {
//初始化map
super.initState();WidgetsBinding.instance.addPostFrameCallback((_) {
//添加方法
});}
具体使用场景可以在自己的项目实践中挖掘。