我们在上一章回中介绍了组件之间共享数据相关的内容,本章回中将继续介绍该内容.闲话休提,让我们一起Talk Flutter吧。
1. 知识回顾
我们在前面章回中介绍了全局共享数据相关的内容,当时介绍了获取共享数据的三种方法,本章回将介绍其中的一种方法:使用Selector获取共享数据。
2. 使用方法
Selector是一个Widget,它提供了builder,selector,shouldRebuild和child四个属性,一方面它可以转换数据类型,另一方面它可以获取共享数据。我们可以
通过selector属性获取到共享数据类型的对象,然后就可以使用共享类型提供的getter方法获取对象中的共享数据,把共享数据转换后再返回给builder属性。我们重
点介绍Selector的builder属性,selector属性和shouldRebuild属性,前两个属性都是必选属性,也就是说我们必须给这些属性赋值。
2.1 builder属性
该属性是方法类型,方法中包含三个参数,方法返回Widget对象,该方法和Consumer中buidler属性对应的方法相似,不同的地方只方法中第二个参数的类型,该方法
中三个参数的详细功能如下:
- context:主要用来创建Widget,为创建Widget提供上下文环境;
- value:是泛型类型,它用来表示转换数据类型后的对象;
- child:表示Selector组件的子组件,因此它代表的对象和Selector组件的child属性代表的对象相同;
selector属性
该属性是方法类型,方法中包含两个参数,方法返回转换后的数据类型,下面是该方法的函数原型和相关参数的详细介绍:S Function(BuildContext, A) selector,
- BuildContext:主要用来创建Widget,为创建Widget提供上下文环境;
- A:它是泛型类型,它用来表示共享数据对象,通过该对象的getter方法可以获取到共享数据,然后就可以转换数据类型;
- S:它是泛型类型,它用来表示转换数据类型后的对象,它和builder属性中的第二个参数类型相同;
2.2 shouldRebuild属性
该属性是方法类型,方法中包含两个参数,方法返回true或者false.返回值表示是否更新组件以及组件中的共享数据。该属性是可选属性,默认返回false.下面是该方
法的函数原型和相关参数的详细介绍:bool Function(T previous, T next)
- previous:它是泛型类型,它用来表示转换前数据类型的对象;
- next:它是泛型类型,它用来表示转换后数据类型后的对象;
注意:这两个属性的类型相同,表示把共享数据类型转换后的数据类型,也就是selecttor属性中的S。
2.3 child属性
该属性表示Selector中的子组件,它和builder属性对应方法中的child参数相同。介绍完组件中所有属性相关的内容后,我们通过具体的代码来演示它的使用方法。
3. 示例代码
class WidgetC extends StatelessWidget {
const WidgetC({
super.key,
});
Widget build(BuildContext context) {
// TODO: implement build
return Selector<ViewModel, ViewModelAfterTranslate>(
///把新类型中数据通过child显示出来
builder: (context, viewModelAnother,child) {
print('builder of Selector of Widget C running');
return Text('Widget C data: ${viewModelAnother.getIntData}');
},
///在selector中进行数据类型转换,通过参数传入原类型,在方法中转换后返回新类型
selector: (context, viewModel) {
ViewModelAfterTranslate obj = ViewModelAfterTranslate();
///依据共享数据的值来转换数据,转换后的数据通过builder属性显示出来
/// 字符串是通过button修改产生的,这里写成固定的值,实际项目中不能这样写
if(viewModel.getData == 'change data') {
obj.setIntData = 1;
}else if(viewModel.getData == 'another value'){
obj.setIntData = 2;
}else {
obj.setIntData = 0;
}
return obj;
},
///可以配置是否需要更新数据,默认值为false,它是可选属性
///注意方法中的参数类型是新数据类型,也就是转换后的数据类型
// shouldRebuild:(previous,next) => true,
shouldRebuild:(previous,next) {
print(' prev: ${previous.getIntData}, next: ${next.getIntData}');
if (previous.getIntData == next.getIntData) {
return false;
} else {
return true;
}
},
///没有使用该属性
child: Text('child'),
);
}
}
在上面的代码中,把Selector组件封装到了一个独立的组件中,一方面可以减少代码的耦合,另一方面可以给builder属性和slector属性传递BuildContext类型的
参数,代码中相关的地方都添加了注释,我就不详细介绍了,此外代码给Selector指定了泛型类型:ViewModel和viewModelAnother。前者是共享数据的类型,详
细的定义可以参数前面章回的示例代码。后者是转换数后的类型,它和viewModel的内容类似,不同之处在于把数据类型从String变成了int.用来表示转换数据类型。
和Consumer类似,Selector也有Selector2,Selector3这些类,它们用来对多种数据类型做转换,我在这里就不详细介绍它们的使用方法了,大家可以自己动手去实践。
看官们,关于"全局共享数据之Selector"相关的内容就介绍到这里,欢迎大家在评论区交流与讨论!