2

我有两个流:

  • Stream<FirebaseUser> FirebaseAuth.instance.onAuthStateChanged
  • Stream<User> userService.streamUser(String uid)

我的 userService 需要经过身份验证的 FirebaseUser 的 uid 作为参数。

由于我可能需要在我的应用程序的多个部分访问 streamUser() 流,我希望它成为我项目根目录的提供者。

这就是我的 main.dart 的样子:

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  Widget build(BuildContext context) {
    var auth = FirebaseAuth.instance;
    var userService = new UserService();
    return MultiProvider(
      providers: [
        Provider<UserService>.value(
          value: userService,
        ),
      ],
      child: MaterialApp(
        home: StreamBuilder<FirebaseUser>(
            stream: auth.onAuthStateChanged,
            builder: (context, snapshot) {
              if (!snapshot.hasData) return LoginPage();
              return StreamProvider<User>.value(
                value: userService.streamUser(snapshot.data.uid),
                child: HomePage(),
              );
            }),
      ),
    );
  }
}

问题是当我导航到不同的页面时,MaterialApp 下面的所有内容都被更改了,并且我失去了 StreamProvider 的上下文。

有没有办法将 StreamProvider 添加到 MultiProvider 提供者列表中?因为当我尝试时,我还必须为 FirebaseUser 创建另一个 onAuthStateChanged 流,而且我不知道如何将它们组合成一个 Provider。

4

2 回答 2

0

也许您可以尝试这种方法:

主要.dart

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MultiProvider(
      providers: [
        Provider<FirebaseUser>(
          builder: (_) => FirebaseUser(),
        ),
      ],
      child: AuthWidgetBuilder(builder: (context, userSnapshot) {
        return MaterialApp(
          theme: ThemeData(primarySwatch: Colors.indigo),
          home: AuthWidget(userSnapshot: userSnapshot),
        );
      }),
    );
  }
}

AuthWidgetBuilder.dart

用于创建需要由所有小部件访问的用户相关对象。此小部件应位于 [MaterialApp] 上方。请参阅 [AuthWidget],这是一个使用此构建器生成的快照的后代小部件。

class AuthWidgetBuilder extends StatelessWidget {
  const AuthWidgetBuilder({Key key, @required this.builder}) : super(key: key);
  final Widget Function(BuildContext, AsyncSnapshot<User>) builder;

  @override
  Widget build(BuildContext context) {

    final authService =
        Provider.of<FirebaseUser>(context, listen: false);
    return StreamBuilder<User>(
      stream: authService.onAuthStateChanged,
      builder: (context, snapshot) {

        final User user = snapshot.data;
        if (user != null) {
          return MultiProvider(
            providers: [
              Provider<User>.value(value: user),
              Provider<UserService>(
                builder: (_) => UserService(uid: user.uid),
              ),
            ],
            child: builder(context, snapshot),
          );
        }
        return builder(context, snapshot);
      },
    );
  }
}

AuthWidget.dart

根据用户快照构建登录或未登录 UI。此小部件应位于 [MaterialApp] 下方。此小部件需要 [AuthWidgetBuilder] 祖先才能工作。

class AuthWidget extends StatelessWidget {
  const AuthWidget({Key key, @required this.userSnapshot}) : super(key: key);
  final AsyncSnapshot<User> userSnapshot;

  @override
  Widget build(BuildContext context) {
    if (userSnapshot.connectionState == ConnectionState.active) {
      return userSnapshot.hasData ? HomePage() : SignInPage();
    }
    return Scaffold(
      body: Center(
        child: CircularProgressIndicator(),
      ),
    );
  }
}

这最初来自 Andrea Bizotto 的高级提供者教程。但是我根据您上面的代码定制了一些代码。希望这有效,祝你好运!

参考: https ://www.youtube.com/watch?v=B0QX2woHxaU&list=PLNnAcB93JKV-IarNvMKJv85nmr5nyZis8&index=5

于 2019-12-01T06:06:48.650 回答
0

所以这似乎工作正常:

StreamProvider<User>.value(
  value: auth.onAuthStateChanged.transform(
    FlatMapStreamTransformer<FirebaseUser, User>(
      (firebaseUser) => userService.streamUser(firebaseUser.uid),
    ),
  ),
),

如果有人在某些边缘情况下对此有疑问,请告诉我。

感谢pskink关于flatMap的提示。

于 2019-10-06T19:15:38.030 回答