Flutter 路由拦截

这是一篇入门级教程，更适用于小型项目。

一. 为何须要路由拦截

假如咱们想在用户没有登陆的时候自动跳转到登陆页面，在登陆的时候能够正常浏览其余页面。这样每一次打开页面的时候都去判断登陆状态很是麻烦，咱们能够利用MaterialApp的onGenerateRoute属性。

二. onGenerateRoute 介绍

• onGenerateRoute只会对命名路由生效
• onGenerateRoute属性，它在打开命名路由时可能会被调用
• 若是指定的路由名在路由表中已注册，则会调用路由表中的builder函数来生成路由组件
• 若是路由表中没有注册，才会调用onGenerateRoute来生成路由

三. 准备工做

根据上面 onGenerateRoute 的介绍，咱们必须作以下处理：

MaterialApp(
    // home: MyHomePage(),
    // routes: routes,
    initialRoute: "index",
    onGenerateRoute: onGenerateRoute,
);
复制代码

• 删除路由表 routes
• 删除 home
• 使用 initialRoute

四. 创建 onGenerateRoute 函数

Route<dynamic> onGenerateRoute(RouteSettings settings) {
    String routeName;
    routeName = routeBeforeHook(settings);
    return MaterialPageRoute(builder: (context) {
      /// 注意：若是路由的形式为: '/a/b/c'
      /// 那么将依次检索 '/' -> '/a' -> '/a/b' -> '/a/b/c'
      /// 因此，我这里的路由命名避免使用 '/xxx' 形式
      switch (routeName) {
        case "index":
          return MyHomePage();
        case "login":
          return LoginScreen();
        default:
          return Scaffold(
            body: Center(
              child: Text("页面不存在"),
            ),
          );
      }
    });
  }
复制代码

到这里咱们只是实现了路由名称 --> 具体的页面的映射，下面还要实现“路由钩子”，用来实现拦截功能。

五. 实现拦截功能

创建 routeBeforeHook 函数，并在 onGenerateRoute 函数中调用

String routeBeforeHook(RouteSettings settings) {
    /// Global.prefs 是全局的 SharedPreferences 实例
    /// SharedPreferences 是经常使用的本地存储的插件
    final token = Global.prefs.getString('token') ?? '';
    if (token != '') {
      if (settings.name == 'login') {
        return 'index';
      }
      return settings.name;
    }
    return 'login';
  }
复制代码

六. 最后

不要吝啬各位手里的赞啊！

End.