颤振：导航路线不适用于身份验证答案

【问题标题】：flutter: Navigation routes not working on authentication颤振：导航路线不适用于身份验证
【发布时间】：2021-07-24 18:24:00
【问题描述】：

我是新来的颤振并试图让它发挥作用。我有一个 Welcome() 页面，它有两个按钮（SignUp 和 SignIn），它们会将您带到 SignUp() 和 SignIn() 页面。成功验证后，应用程序应该导航到 Home()，但它没有。如果用户注销，它也不会返回 Welcome() 页面。此外，如果应用程序已启动并且用户已经登录，它不会自动转到 Home()，它会停留在 Welcome()。我在这里做错了什么？我正在使用这样的 StreamProvider

if (snapshot.connectionState == ConnectionState.done) {
    return StreamProvider<User>.value(
        value: AuthService().user, child: Wrapper());
}

我的包装看起来像这样：

class Wrapper extends StatelessWidget {
  const Wrapper({Key key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    final user = Provider.of<User>(context);

    if (user != null)
      print(user.id);
    else
      print("User is null");

    return MaterialApp(initialRoute: '/', routes: {
      '/': (context) => user == null ? Welcome() : Home(),
      '/signup': (context) => SignUp(),
      '/signin': (context) => SignIn()
      '/profile': (context) => Profile(),
      '/edit': (context) => Edit()
    });
}

这会打印用户 ID，这意味着用户不为空，但它不会导航到 Home()。

【问题讨论】：

标签： flutter

【解决方案1】：

我不是要你做什么，我只是告诉你我通常是怎么做的。

这个概念很简单。当用户成功登录或注册后，您必须将此信息保存在shared_preference 中。它可能类似于 auth : true。

您还必须等待应用程序启动过程，以查看用户是否已经登录，并基于此，您可以导航到另一个屏幕。

要在启动时检查用户是否已通过身份验证，您必须阅读您之前在 shared_preference 中添加的 auth 属性。看这段代码：

void main() async {
  var mapp;
  var routes = <String, WidgetBuilder>{
    '/initialize': (BuildContext context) => Initialize(),
    '/register': (BuildContext context) => Register(),
    '/home': (BuildContext context) => Home(),
  };
  print("Initializing.");
  WidgetsFlutterBinding.ensureInitialized();
  await SharedPreferencesClass.restore("initialized").then((value) {
    if (value) {
      mapp = MaterialApp(
        debugShowCheckedModeBanner: false,
        title: 'AppName',
        theme: ThemeData(
          primarySwatch: Colors.blue,
        ),
        routes: routes,
        home: Home(),
      );
    } else {
      mapp = MaterialApp(
        debugShowCheckedModeBanner: false,
        title: 'AppName',
        theme: ThemeData(
          primarySwatch: Colors.blue,
        ),
        routes: routes,
        home: Initialize(),
      );
    }
  });
  print("Done.");
  runApp(mapp);
}

这段代码很容易解释。您可以根据自己的优势对其进行调整。

要导航到新屏幕很简单，只需使用以下代码：

Navigator.push(
    context,
    MaterialPageRoute(builder: (context) => SecondRoute()),
  );

【讨论】：