Flutter Riverpod:在构建函数之外使用ref.watch



在我的Flutter应用程序中,我有一个函数gotoPage((,它将PageView小部件动画化为新页面。我希望每当更新newPageProvider时都能调用此函数。如何";激活";当gotoPage((不是build((函数的一部分时,函数gotoPage(内的ref.watch((?

providers.dart

final newPageProvider = StateProvider<int>((ref) => 0);

小工具.dart

class _WidgetState extends ConsumerState<WidgetState> {
final pageController = PageController(
initialPage: 0,
);
@override
Widget build(BuildContext context) {
return PageView.builder(
controller: pageController,
itemCount: data.length,
itemBuilder: (context, index) {
return WidgetCard(poi: data[index], itemIndex: index);
},
);
}
void gotoPage() {
final index = ref.watch(newPageProvider);
pageController.animateToPage(
index,
);
}
}

我相信答案是使用ref.listen,而不是ref.watch(如下所示(。

来自RiverPod用户指南:

类似于ref.watch,可以使用ref.listen来观察提供商。

它们之间的主要区别在于如果侦听的提供程序发生更改,则使用ref.listen将调用一个自定义函数。

侦听方法不应异步调用,如在onPressed或提升按钮。它也不应该在initState和其他State生命周期中使用。

providers.dart

final newPageProvider = StateProvider<int>((ref) => 0);

小工具.dart

class _WidgetState extends ConsumerState<WidgetState> {
final pageController = PageController(
initialPage: 0,
);
@override
Widget build(BuildContext context) {
ref.listen<int>(newPageProvider, (int previousIndex, int newIndex) {
_gotoPage(newIndex);
});
return PageView.builder(
controller: pageController,
itemCount: data.length,
itemBuilder: (context, index) {
return WidgetCard(poi: data[index], itemIndex: index);
},
);
}
void gotoPage(index) {
pageController.animateToPage(
index,
);
}
}
编辑:在build()中使用ref.listen

像这样:

@override
Widget build(BuildContext context){
ref.listen(
newPageProvider,
(oldIndex, newIndex){
pageController.animateToPage(newIndex);
}
);
return Scaffold(...);
}

最新更新