在开发过程中,经常遇到需要缓存的页面,尤其是在tabbarview切换的时候,需要保存原来的页面状态,所以会用到keepalive的相关组件,但是有时候我们又需要手动去更新这个缓存的组件,这个时候就需要用到ValueListenableBuilder,通过控制变量的变化进行手动局部更新。
1、定义进行控制的变量,可以是String,bool,int等类型,如图为String类型
final ValueNotifier<String> Flag = ValueNotifier<String>("myflag");
2、在合适的时机进行修改该变量的值,我的需要是在页面返回的时候,判断是否返回带了参数,带参数说明需要更新(常用于在列表页跳转到添加页面,添加完后返回需要进行页面更新,正常是会自动更新,但是如果进行了缓存则不会更新),则修改。
onTap: () => Navigator.of(context)
.pushNamed("/addColleague")
.then((value) {
if (value != null) {
Flag.value = "myFlag2";
}
}),
3、用ValueListenableBuilder包裹需要进行手动更新的页面
TabBarView(
controller: _tabController,
children: [
KeepAliveWrapper(child: OrganizationStructure()),
// 本文为两个缓存的tabbarview页面,第二个页面在添加完后需要刷新
ValueListenableBuilder<String>(
builder: (BuildContext context, String value, Widget? child) {
return KeepAliveWrapper(
child: AddressBookPage(
key: ValueKey(value),
));
},
valueListenable: Flag,
),
]
),
尝试过通过修改 widget 的key进行更新,没有更新,应该是keepalivewrapper的缘故,引入ValueListenableBuilder后成功~