我们在上一章回中介绍了组件之间共享数据相关的内容,本章回中将继续介绍该内容.闲话休提,让我们一起Talk Flutter吧。
1. 知识回顾
我们在前面章回中介绍了全局共享数据相关的内容,当时介绍了获取共享数据的三种方法,本章回将介绍其中的一种方法:使用Consumer获取共享数据。
2. 使用方法
Consumer是一个Widget,它提供了builder和child两个属性,我们可以通过builder属性获取到共享数据类型的对象,然后就可以使用共享类型提供的getter方法
获取对象中的共享数据。我们重点介绍Consumer的builder属性,该属性是必选属性,也就是说我们必须它该属性赋值,该属性是方法类型,方法中包含三个参数,方
法返回Widget对象,该方法的函数原型,以及方法中三个参数的详细功能如下:
final Widget Function(
BuildContext context,
T value,
Widget? child,
) builder;
- context:主要用来创建Widget,为创建Widget提供上下文环境;
- value:是泛型类型,它用来表示共享数据对象,通过该对象的getter方法可以获取到共享数据;
- child:表示Consumer组件的子组件,因此它代表的对象和Consumer组件的child属性代表的对象相同;
介绍完Consumer组件中builder属性的相关内容后,我们通过具体的代码来演示它的使用方法
3. 示例代码
class WidgetB extends StatelessWidget {
const WidgetB({
super.key,
});
Widget build(BuildContext context) {
///使用consumer共享数据时consumer外层的build不调用,只调用consumer中builder属性对应的方法
print('builder of Widget B running');
return Consumer<ViewModel>(
builder: (context, data, child) {
print('builder of Consumer of Widget B running');
if (child != null) {
///在这里添加需要更新的widget
print(' child is not null');
}
print('data is: ${data.getData}');
return Text("Widget B data: ${data._data}");
},
///在这里添加不需要更新的widget,这个child和builder方法中的child一样
child: Text('childe of consumer'),
);
}
}
在上面的代码中,把Consumer组件封装到了一个独立的组件中,一方面可以减少代码的耦合,另一方面可以给builder属性传递BuildContext类型的参数,代码
中相关的地方都添加了注释,我就不详细介绍了,此外代码给Consumer指定了泛型类型:ViewModel。它是共享数据的类型,详细的定义可以参数前面章回的示例代码。
4. 经验分享
Consumer组件在实际项目中使用比较多,因为它的性能比Provider组件好一些,比如上面代码中如果共享数据有变化,那么Consumer组件所在的组件WidgetB不会
更新,也就是说WidgetB的build()方法不会被回调,回调的是Consumer组件builder属性对应的方法。
我们介绍的Consumer组件只能共享一种类型的数据,我们还可以使用Consumer2,Consumer3组件来共享2种,3种类型的数据,我们在这里就不介绍了,它们的用法
相似,大家可以自己动手去实践。
看官们,关于"全局共享数据之Consumer"相关的内容就介绍到这里,欢迎大家在评论区交流与讨论!