Flutter Web App 错误 - 找不到正确的提供者

Question

在 WebApp 中使用 Provider 时出现以下错误。我以前在创建 none webapps 时见过这个问题，通常可以修复它。但是我看不到错误在 webapp 中的位置。我正在 Main.dart 和 MaterialApp 小部件上方创建 MultiProvider。这是错误：

Error: Could not find the correct Provider<List> above this CategoryWidget Widget

发生这种情况是因为您使用的 BuildContext 不包括提供商任您选择。

还有我的 MultiProvider 代码：

class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
 return FutureBuilder(
    future: Firebase.initializeApp(),
    builder: (context, snapshot) {
      // Check for errors
      if (snapshot.hasError) {
        return MaterialApp(
          home: Scaffold(
            body: Container(
                alignment: Alignment.center,
                child: const Text('ERROR: DID NOT INITIALIZE FIREBASE!')),
          ),
        );
      }

      if (snapshot.connectionState == ConnectionState.done) {
        print("FIREBASE INITIALIZED");
        final catCollection = FirebaseFirestore.instance
            .collection('categories')
            .orderBy("active", descending: true);
        final categories = catCollection.snapshots().map((snapShot) =>
            snapShot.docs
                .map((catDoc) => Category.fromMap(catDoc.data(), catDoc.id))
                .toList());

        return MultiProvider(
          providers: [
            StreamProvider<User?>(
              create: (_) => FirebaseAuth.instance.authStateChanges(),
              initialData: null,
            ),
            StreamProvider<List<Category?>>(
              create: (_) => categories,
              initialData: [],
            ),
            ChangeNotifierProvider.value(
              value: Categories(),
            ),
            ChangeNotifierProvider.value(
              value: Auth(),
            ),
          ],
          child: MaterialApp(
            title: "Qi Gang's Dashboard",
            debugShowCheckedModeBanner: false,
            // home: LoginSignupScreen(isLoginForm: true),
            initialRoute: LoginSignupScreen.id,
            routes: {
              LoginSignupScreen.id: (context) =>
                  LoginSignupScreen(isLoginForm: true),
              MainScaffold.id: (context) => MainScaffold(),

在小部件树的下方，从 MainScaffold 调用的是我的 CategoryWidget，错误发生的位置：

Widget categoryGrid(BuildContext context) {

  final categories = Provider.of<List<Category>>(context);

我已经尝试解决这个问题一段时间了，但现在被屏蔽了，所以如果你能指出我这里哪里出错了，我将不胜感激。

非常感谢

Answer 1

您可以在提供商官方文档中阅读。 here

context.watch<T>(), which makes the widget listen to changes on T
context.read<T>(), which returns T without listening to it
context.select<T, R>(R cb(T value)), which allows a widget to listen to only a small part of T.

这些方法将从与传递的 BuildContext 关联的小部件开始在小部件树中查找，并将 return the nearest variable of type T 找到（如果没有找到则抛出）。

并且在您的代码中，您在提供程序中定义了 <List<Category?>>，并且您正在寻找 <List<Category>> 小部件树，因此这会给您带来错误。

Answer 2

您需要将提供程序添加（或初始化）到main.dart，然后尝试使用它。一定会成功的。

Flutter Web App 错误 - 找不到正确的提供者

Flutter Web App Error - Could not find the correct Provider

flutter

flutter-dependencies

flutter-web