从对话框访问提供程序以获取 Flutter 钩子答案

【问题标题】：Access Providers from Dialogs for Flutter hooks从对话框访问提供程序以获取 Flutter 钩子
【发布时间】：2021-08-04 09:46:26
【问题描述】：

我是 Flutter hooks 和 riverpod 的新手

基本上我有一个将书籍列表存储在书架中的提供商。

class BookList extends StateNotifier<List<BookModel>> {
  BookList() : super([]);

  void setBookList(List<BookModel> bookList) =>
     {state = bookList};
}

final bookListProvider = StateNotifierProvider<BookList>((_) => BookList());

然后我有一个显示书籍的页面和一个显示创建新书对话框的创建按钮：

class BookShelfPage extends HookWidget {
  @override
  Widget build(BuildContext context) {
      final bookList = useProvider(bookListProvider.state);
      
      useEffect(() {
        //API to get list of books
        context.read(bookListProvider).setBookList(//data from API);
      },[]);

      final Function() onCreateBookButtonClicked = () {      
        showDialog(
          context: context,
          builder: (context) => ProviderScope(
            child: (new BookCreateDialog())));
      };


      //Data is available for this
      print("book list length 1: " + bookList.length.toString()); 
  }

但是，我无法访问对话框中的提供程序值：

class BookCreateDialog extends HookWidget {
   @override
   Widget build(BuildContext context) {
      final bookList = useProvider(bookListProvider.state);
      
      //Data is not available for this
      print("book list length 2: " + bookList.length.toString()); 
   }
}

注意事项：

我有一个 ProviderScope 包装我的应用程序。
我没有任何问题持续存在或访问不同 PAGES 上的提供程序或驻留在 PAGES 上的任何子小部件，但我无法从对话框访问提供程序值。
当然，我可以将提供者的值作为参数传递给对话框，但我想知道是否有任何方法可以避免这种情况，因为我可以从提供者那里获得很多值。

我可以知道如何解决这个问题吗？非常感谢！

【问题讨论】：

标签： flutter riverpod flutter-hooks flutter-dialog

【解决方案1】：

您只想在两种情况下使用ProviderScope。首先是包装你提到的应用程序。另一种情况是使用ScopedProvider时。

你在这里基本上在做什么：

builder: (context) => ProviderScope(child: BookCreateDialog());

正在创建一个新范围，其中您的 StateNotifierProvider 的值不可用（因为该值位于应用根目录的 ProviderScope 中）。

删除ProviderScope，您应该会得到预期的结果。

【讨论】：