Question

不确定问题的标题是否正确，所以我想在下面更详细地描述它。提供程序的所有示例都显示了在 MaterialApp 上方使用提供程序的情况，但是我很感兴趣并希望在 MaterialApp 的“下方”使用它。

请看下面的代码。

应用的main.dart

// ...
return MultiProvider(
      providers: [
        ChangeNotifierProvider(create: (_) => Provider1()),
        ChangeNotifierProvider(create: (_) => Provider2()),
        ChangeNotifierProvider(create: (_) => Provider3()),
      ],
      builder: (context, child) {
        return MaterialApp(
          title: 'My app',
          theme: ThemeData(
            primarySwatch: Colors.blue,
          ),
          home: SplashScreen(),
          debugShowCheckedModeBanner: false,
        );
      },
    );
// ...

SplashScreen 决定是将用户移动到主页还是注册/登录屏幕：

return Scaffold(
      body: StreamBuilder<User?>(
          stream: FirebaseAuth.instance.authStateChanges(),
          builder: (context, snapshot) {
            if (snapshot.hasError) {
              return RegistrationScreen();
            }

            if (snapshot.connectionState == ConnectionState.waiting) {
              return Container();
            }

            var user = snapshot.data;

            if (user == null) {
              log('User is signed out.');
              return RegistrationScreen();
            } else {
              log('Signed in user: $user');

              return FutureBuilder<QuerySnapshot>(
                  future: usersCollection
                      .where('email', isEqualTo: user.email)
                      .get(),
                  builder: (context, snapshot) {
                    if (snapshot.hasError) {
                      return RegistrationScreen();
                    }

                    if (snapshot.connectionState == ConnectionState.waiting) {
                      return Container();
                    }

                    if (snapshot.data == null) {
                      return RegistrationScreen();
                    } else {
                      return HomeScreen(snapshot.data!.docs[0].reference);
                    }
                  });
            }
          }),
    );

现在我们进入问题所在的部分。这个想法是让 HomeScreen 监听 Firebase 用户的变化，以便每个感兴趣的底层小部件都能做出适当的反应（注销、更新标题中的用户名或其他）。

HomeScreen 代码如下所示：

class HomeScreen extends StatefulWidget {
  final DocumentReference user;

  HomeScreen(this.user);

  @override
  _HomeScreenState createState() => _HomeScreenState();
}

class _HomeScreenState extends State<HomeScreen> {
  @override
  Widget build(BuildContext context) {
    return FutureBuilder<DocumentSnapshot>(
        future: widget.user.get(),
        builder: (context, snapshot) {
          if (snapshot.hasError) {
            return SplashScreen();
          }

          if (snapshot.connectionState == ConnectionState.waiting) {
            return Container();
          }

          var user = snapshot.data!;

          return StreamProvider<DocumentSnapshot>(
            create: (_) => widget.user.snapshots(),
            initialData: user,
            builder: (context, child) {
              return Scaffold(
                  appBar: AppBar(
                    title: Text('My list of data'),
                    actions: <Widget>[
                      IconButton(
                          icon: Icon(Icons.account_circle_outlined,
                              color: Colors.white),
                          onPressed: () {
                            Navigator.push(
                                context,
                                MaterialPageRoute(
                                    builder: (context) => ProfileScreen()));
                          })
                    ],
                  ),
                  body: MyListOfDataScreen());
            },
          );
        });
  }
}

但是每当我离开屏幕时（例如使用应用栏操作或其他操作到 ProfileScreen），我都会收到下一个问题：

我了解问题的根本原因 - ProfileScreen 在小部件树中的 MaterialApp 下，因此它无法访问 HomeScreen 中的 StreamProvider。

我怎样才能使它低于 HomeScreen 以便它可以访问提供程序？将来，为了可维护性和更广泛的访问范围，我希望将提供者限制在某些屏幕上。

嵌套小部件中的 Flutter 流提供程序？

0 个答案: