Flutter-根据登录状态以不同的路线启动应用 [英] Flutter - Start app with different routes depending on login state

问题描述

我正在寻找一种方法来根据登录状态在应用启动时显示不同的屏幕.例如，我定义了以下路由:

I'm searching for a way to show a different screens on app startup depending on login state. For example, I have the following routes defined:

• /home
• /登录
• /设置

自然，我将检查用户是否已经在main()方法内登录，然后将我的MaterialApp的initialRoute设置为/login或/home.成功登录后，我可以调用Navigator.pushReplacement导航至/home，并从堆栈中删除登录屏幕.不幸的是，我总是必须为/定义路由或设置MaterialApp的home属性.因此，如果将/设置为空白的Container()，则此Container将位于导航堆栈中，用户可以返回到该空白屏幕.

Naturally, I would check if the user has already logged in within the main() method and then set the initialRoute of my MaterialApp to either /login or /home. After successful login, I can call Navigator.pushReplacement to navigate to /home and the login screen is removed from the stack. Unfortunately, I always have to either define a route for / or set the home property of MaterialApp. So if I set / to a blank Container(), this Container will be on the navigation stack and the user can go back to this blank screen.

我想到的两个选择是:

• 将MaterialApp的home属性设置为HomeScreen或LoginScreen
• 如果用户尚未登录，请在HomeScreen的build()方法中返回LoginScreen.

• Setting the home property of MaterialApp to either HomeScreen or LoginScreen
• Return a LoginScreen within HomeScreen's build() method, if the user has not logged in yet

这两个选项都是可行的，但是为了更新home属性或HomeScreen，我必须提出一些重载逻辑并重新设置状态.

Both options are feasible, but then I have to come up with some reload logic and re-set the state in order to update the home property or HomeScreen.

有什么想法在Flutter中处理此类案件的正确方法是什么?

Any ideas what is the proper way in Flutter to deal with such cases?

推荐答案

也许，您可以这样做.假设您有一个使用异步方法isLogged的Auth类.

Maybe, you could do this. Imagine you have a class Auth with an async method isLogged.

class Auth {
  final FirebaseAuth _firebaseAuth = FirebaseAuth.instance;

  Future<bool> isLogged() async {
    try {
      final FirebaseUser user = await _firebaseAuth.currentUser();
      return user != null;
    } catch (e) {
      return false;
    }
  }
}

您可以使用myApp构造函数传递initialRoute，并根据登录状态决定初始路由.然后，您可以将myApp的实例传递给runApp:

You could use the myApp constructor to pass the initialRoute, and decide the initial route depending on the login state. Then, you can pass the instance of myApp to runApp:

警告::如果发生错误，请在void main() async {之前添加WidgetsFlutterBinding.ensureInitialized();.检查此问题#40253 .

Warning: In case of error, add WidgetsFlutterBinding.ensureInitialized(); just before void main() async {. Check this issue #40253.

void main() async {
  WidgetsFlutterBinding.ensureInitialized();
  final Auth _auth = Auth();
  final bool isLogged = await _auth.isLogged();
  final MyApp myApp = MyApp(
    initialRoute: isLogged ? '/home' : '/',
  );
  runApp(myApp);
}

在那之后，您必须修改myApp类以在构造函数中传递初始路由:

After that, you have to modify the myApp class to pass the initial route in the constructor:

class MyApp extends StatelessWidget {
  final String initialRoute;

  MyApp({this.initialRoute});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Dynamic Route Demo',
      initialRoute: initialRoute,
      routes: {
        '/': (context) => LoginPage(),
        '/home': (context) => HomePage(),
        '/settings': (context) => SettingsPage(),
      },
    );
  }
}

希望这会有所帮助.

这篇关于Flutter-根据登录状态以不同的路线启动应用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！