Flutter 命名路由以及命名路由傳參數

在一些中大型項目當中基本路由配置起來太麻煩了，所以有了命名路由，命名路由就是把所有路由集中起來統一管理，完了以后要用直接調用即可！

我們來看具體使用步驟：

先創建一個路由文件:\lib\routes\Routes.dart

在這里我們引入我們所有要跳轉到的頁面：

示例：

import 'package:film/pages/tabs.dart';  
import 'package:flutter/material.dart';
import '../pages/atabs/from.dart';
import '../pages/atabs/search.dart';
import '../pages/atabs/fromz.dart';

然后接下來就是定義路由  有一個不傳參數和一個傳參數的：

final Map<String, Function> routes = {
  '/': (context) => tabs(),
  '/from': (context) => from(),  //不傳參數
  '/fromxz': (context, {arguments}) => fromxz(arguments: arguments) //傳參數
};

不傳參數還好，傳參數要進行下一步。

然后接下來開始寫判斷傳參和不傳參 固定寫法 

var onGenerateRoute = (RouteSettings settings) {
  //String? 表示name為可空類型
  final String? name = settings.name;
  //Function? 表示pageContentBuilder為可空類型
  final Function? pageContentBuilder = routes[name];
  if (pageContentBuilder != null) {
    if (settings.arguments != null) {
      final Route route = MaterialPageRoute(
          builder: (context) =>
              pageContentBuilder(context, arguments: settings.arguments));
      return route;
    } else {
      final Route route =
          MaterialPageRoute(builder: (context) => pageContentBuilder(context));
      return route;
    }
  }
};

 

 之后然后再在全局變量里面進行引入：

import './routes/Routes.dart';

首先這里我們設置一個初始化加載的路由和給onGenerateRoute 路由賦值上面我已經導入寫入了 

 

接下來我們就可以使用我們已經配置好的路由了

傳入的參數我們通過構造函數進行接受