在使用 riverpod 的情况下,如何更新导航堆栈中已有页面的状态
In flutter with riverpod, how to update state on a page already in the navigation stack
我有一些 flutter/riverpod/navigator 2.0 页面遵循此流程。
项目列表页面 -> 导航到 -> 编辑项目页面 -> 后退按钮 -> 项目列表页面。
问题是当点击后退按钮时,项目列表没有用新内容更新,因为该页面缓存在页面的导航堆栈中。
对于如何处理这个案例有什么建议吗?
好的,我刚开始工作!非常简短的版本是在您的第一个表单上使用嵌套在 ProviderListener 中的 Consumer。对我来说,第一种形式显示了检索到的模型列表。在那个列表页面上我有...
Widget build(BuildContext context) {
return ProviderListener(
onChange: (context, state) {
// Below Model.save in provider sets state to
// "Success(model)". This triggers here and we
// List.update in provider to update fields in
// the Model in the List. Then the Consumer
// below triggers on "Data(model)" state and the
// List refreshes and shows updated Model
if (state is Success) {
context.read(regionListNotifierProvider.notifier).update(state.model);
}
},
provider: regionNotifierProvider,
child: Consumer(builder: (context, watch, child) {
final state = watch(regionListNotifierProvider);
在列表页面上,每个磁贴都是可点击的。当您单击时,它使用模型提供程序将状态设置为您刚刚单击的模型。然后它导航到表单。表单读取状态并查看您在列表中单击的模型的信息。
在我的 ModelForm(您编辑模型字段的地方)中,当您保存它时,它会触发其提供程序中的保存方法。在那里,它触发上面的 .update,然后 ModelForm Navigator.pops 返回到列表页面,然后上面的 Listener 和 Consumer 依次触发,List 显示更新的数据。
注意: ProviderListener 监听 ModelForm 提供者,然后 Consumer 监听 List 提供者。跟随?这是 终于奏效的技巧!
NOTE2: 这些都是无状态的小部件。只需要 Riverpod 提供程序中的状态。他们无所不能。
注意 3: 这 2 个提供者来回交谈。列表将点击的模型提供给表单,当表单保存时,列表页面会听到并更新它的模型列表
如果您需要,我很乐意添加更多详细信息:-)
这个例子难道不能解决问题吗?导航问题已简化为操纵不可变集合。
使用严格类型导航。您可以在代码中使用 navigate([Home(), Books(), Book(id: bookId)]);
而不是 navigate('home/books/$bookId');
。
我有一些 flutter/riverpod/navigator 2.0 页面遵循此流程。
项目列表页面 -> 导航到 -> 编辑项目页面 -> 后退按钮 -> 项目列表页面。
问题是当点击后退按钮时,项目列表没有用新内容更新,因为该页面缓存在页面的导航堆栈中。
对于如何处理这个案例有什么建议吗?
好的,我刚开始工作!非常简短的版本是在您的第一个表单上使用嵌套在 ProviderListener 中的 Consumer。对我来说,第一种形式显示了检索到的模型列表。在那个列表页面上我有...
Widget build(BuildContext context) {
return ProviderListener(
onChange: (context, state) {
// Below Model.save in provider sets state to
// "Success(model)". This triggers here and we
// List.update in provider to update fields in
// the Model in the List. Then the Consumer
// below triggers on "Data(model)" state and the
// List refreshes and shows updated Model
if (state is Success) {
context.read(regionListNotifierProvider.notifier).update(state.model);
}
},
provider: regionNotifierProvider,
child: Consumer(builder: (context, watch, child) {
final state = watch(regionListNotifierProvider);
在列表页面上,每个磁贴都是可点击的。当您单击时,它使用模型提供程序将状态设置为您刚刚单击的模型。然后它导航到表单。表单读取状态并查看您在列表中单击的模型的信息。
在我的 ModelForm(您编辑模型字段的地方)中,当您保存它时,它会触发其提供程序中的保存方法。在那里,它触发上面的 .update,然后 ModelForm Navigator.pops 返回到列表页面,然后上面的 Listener 和 Consumer 依次触发,List 显示更新的数据。
注意: ProviderListener 监听 ModelForm 提供者,然后 Consumer 监听 List 提供者。跟随?这是 终于奏效的技巧!
NOTE2: 这些都是无状态的小部件。只需要 Riverpod 提供程序中的状态。他们无所不能。
注意 3: 这 2 个提供者来回交谈。列表将点击的模型提供给表单,当表单保存时,列表页面会听到并更新它的模型列表
如果您需要,我很乐意添加更多详细信息:-)
这个例子难道不能解决问题吗?导航问题已简化为操纵不可变集合。
使用严格类型导航。您可以在代码中使用 navigate([Home(), Books(), Book(id: bookId)]);
而不是 navigate('home/books/$bookId');
。