flutter的局部刷新的几种方式
第一种 ：使用 GlobalKey
父组件中声明
GlobalKey<_局部刷新对象类型State> textKey = GlobalKey();
textKey.currentState.局部刷新的方法();
第二种
使用：StatefulBuilder
第三种
使用 StreamBuilder + StreamController FutureBuilder & StreamBuilder
第三种：provider （也是异步通信）
ChangeNotifier + ChangeNotifierProvider
第四种 （也是异步通信） ：Flutter ValueNotifier 异步通信、ValueListenableBuilder - 知乎
ValueNotifier + ValueListenableBuilder
第一种：使用 GlobalKey
globalkey唯一定义了某个element，它使你能够访问与element相关联的其他对象，例如buildContext、state等。
使用场景：可以通过key.currentState拿到它的状态对象，然后就可以调用其中的onPressed方法。
//请求刷新 setState((){ }); #State @override Widget build(BuildContext context) { //构建新的Widget return new Text(_text); } 那么，如果 我们能将 build方法中的 return new Text(_text) 暴漏出去，我们就可以实现通用的 局部刷新 Widget。
实现方案
- 接口回调，将return new Text(_text);暴露出去：
用typedef function实现
//定义函数别名 typedef BuildWidget = Widget Function();将函数别名 BuildWidget 作为参数，传递到State.build方法即可
完整代码
import 'package:flutter/material.dart'; //封装 通用局部刷新工具类//定义函数别名typedef BuildWidget = Widget Function(); class PartRefreshWidget extends StatefulWidget { PartRefreshWidget(Key key, this._child): super(key: key); BuildWidget _child; @override State createState() { return PartRefreshWidgetState(_child); } } class PartRefreshWidgetState extends State { BuildWidget child; PartRefreshWidgetState(this.child); @override Widget build(BuildContext context) { return child.call(); } void update() { print('update'); setState(() { }); } } 使用：
import 'package:flutter/material.dart'; import 'PartRefreshWidget.dart'; class GlobalKeyDemo extends StatefulWidget { @override _GlobalKeyDemoState createState() => _GlobalKeyDemoState();} class _GlobalKeyDemoState extends State { int _count = 0; //使用1 创建GlobalKey GlobalKey globalKey = new GlobalKey(); @override Widget build(BuildContext context) { print('----------------build'); return Scaffold( appBar: AppBar( title: Text("inheritedWidget"), ), body: Center( child: Column( mainAxisAlignment: MainAxisAlignment.center, children: [ //使用2 创建通用局部刷新widget PartRefreshWidget(globalKey, () { ///创建需要局部刷新的widget return Text( '变化的：$_count', style: TextStyle(color: Colors.green), ); }), Text('不变的: $_count'), RaisedButton( onPressed: () { //点击 _count++; //使用3调用刷新方法 globalKey.currentState.update(); }, ), ], ), ) ); }} 转载：https://blog.csdn.net/jdsjlzx/article/details/123560075
第二种：使用：StatefulBuilder
使用情景：
多选和单选
单选的时候，选中一个就可以直接把结果返回，因此本身底部弹窗无需状态管理。但到多选的时候，需要知道当前选中的选项，有选项被点击的时候需要存储下来，当再次被点击的时候要清空这个选项，同时界面还需要同步更新，因此就涉及到状态管理了。
实现方式 内部使用。
在Flutter 中提供了一个 StatefulBuilder的类，提供了一个 builder方法构建有状态组件，并且提供了状态更新方法，因此在里面完成状态管理。
在这个 builder方法中，setState其实就是对应状态组件的setState对应的方法，这个 state 就是用于控制 StatefulBuilder生成的组件的状态的。这种方式有点类似于 React的 useState的钩子函数用法
使用的核心代码：
class DemoStatefulBuilderPage extends StatelessWidget { @override Widget build(BuildContext context) { return Scaffold( //状态构建器 body: buildStatefulBuilder(), ); }} int _count = 0; StatefulBuilder buildStatefulBuilder() { return StatefulBuilder( //构建状态改变的Widget builder: (BuildContext context, void Function(void Function()) setState) { //居中 return Center( //手势识别 child: GestureDetector( child: Text("早起的年轻人 $_count"), //单击事件 onTap: () { //刷新当前 StatefulBuilder 中的状态 setState(() { _count++; }); }, ), ); }, ); }第三种 使用 FutureBuilder & StreamBuilder
使用场景：异步UI更新
很多时候我们会依赖一些异步数据来动态更新UI，比如在打开一个页面时我们需要先从互联网上获取数据，在获取数据的过程中显示一个加载框，等获取到数据时我们再渲染页面；又比如我们想展示Stream（比如文件流、互联网数据接收流）的进度。当然StatefulWidget我们完全可以实现以上功能。但由于在实际开发中依赖异步数据更新UI的这种场景非常常见，并且当StatefulWidget中控件树较大时，更新一个属性导致整个树重建，消耗性能，因此Flutter专门提供了FutureBuilder和SteamBuilder两个组件来快速实现这种功能。
FutureBuilder的使用
const FutureBuilder({ Key key, this.future, //获取数据的方法 获取用户异步处理获得数据的代码 this.initialData, //初始的默认数据 初始化数据加载 @required this.builder //数据快照 回调函数，暴露异步处理中的快照。这个是我们构建组件的主要组成。 主要来看一下它的构造函数： }) : assert(builder != null), super(key: key);class _MyHomePageState extends State { Future mockNetworkData() async { return Future.delayed(Duration(seconds: 2), () => "我是从互联网上获取的数据"); } @override Widget build(BuildContext context) { return Scaffold( appBar: AppBar( title: Text(widget.title), ), body: Center( child: Column( mainAxisAlignment: MainAxisAlignment.center, children: [ Text( 'You have pushed the button this many times:', ), FutureBuilder( future: mockNetworkData(), builder: (BuildContext context, AsyncSnapshot snapshot){ if(snapshot.connectionState == ConnectionState.done){ if(snapshot.hasError){ // 请求失败，显示错误 return Text("Error: ${snapshot.error}"); }else { // 请求成功，显示数据 return Text("Contents: ${snapshot.data}"); } }else { return CircularProgressIndicator(); } }), ], ), ), // This trailing comma makes auto-formatting nicer for build methods. ); }} SteamBuilder的使用
class _MyHomePageState extends State { Stream counter(){ return Stream.periodic(Duration(seconds: 1), (i){ return i; }); } @override Widget build(BuildContext context) { return Scaffold( appBar: AppBar( title: Text(widget.title), ), body: Center( child: Column( mainAxisAlignment: MainAxisAlignment.center, children: [ Text( 'You have pushed the button this many times:', ), StreamBuilder( stream: counter(), builder: (BuildContext context, AsyncSnapshot snapshot){ if(snapshot.hasError){ return Text("Error: ${snapshot.error}"); } switch (snapshot.connectionState){ case ConnectionState.none: return Text("没有Stream"); case ConnectionState.waiting: return Text("等待数据、、、"); case ConnectionState.active: return Text("active: ${snapshot.data}"); case ConnectionState.done: return Text("Stream已关闭"); } return null; }), ], ), ), // This trailing comma makes auto-formatting nicer for build methods. ); }} StreamBuilder与StreamController的详细使用：https://blog.csdn.net/u010194271/article/details/128024208
来源地址：https://blog.csdn.net/qq_27909209/article/details/130523131
