導航與路由

Flutter 提供了一個完整的系統，用於在螢幕之間導航和處理深層連結。對於沒有複雜深層連結的小型應用程式，可以使用 Navigator，而對於具有特定深層連結和導航要求的應用程式，還應使用 Router，以便正確處理 Android 和 iOS 上的深層連結，並在應用程式在 Web 上執行時與位址列保持同步。

要配置 Android 或 iOS 應用程式以處理深層連結，請參閱 深層連結。

Navigator 小部件使用正確的過渡動畫顯示螢幕，這些動畫適用於目標平臺。要導航到新螢幕，請透過路由的 BuildContext 訪問 Navigator，並呼叫諸如 push() 或 pop() 之類的命令式方法

child: const Text('Open second screen'),
onPressed: () {
  Navigator.of(context).push(
    MaterialPageRoute<void>(
      builder: (context) => const SecondScreen(),
    ),
  );
},

由於 Navigator 維護一個 Route 物件堆疊（表示歷史記錄堆疊），因此 push() 方法也接受一個 Route 物件。MaterialPageRoute 物件是 Route 的子類，用於指定 Material Design 的過渡動畫。有關如何使用 Navigator 的更多示例，請遵循 Flutter Cookbook 中的 導航示例，或訪問 Navigator API 文件。

具有簡單導航和深層連結要求的應用程式可以使用 Navigator 進行導航，並使用 MaterialApp.routes 引數進行深層連結

child: const Text('Open second screen'),
onPressed: () {
  Navigator.pushNamed(context, '/second');
},

/second 表示在 MaterialApp.routes 列表中宣告的命名路由。有關完整示例，請遵循 Flutter Cookbook 中的 使用命名路由導航 示例。

雖然命名路由可以處理深層連結，但行為始終相同且無法自定義。當平臺收到新的深層連結時，Flutter 會將新的 Route 推送到 Navigator，而不管使用者當前在哪裡。

Flutter 也不支援使用命名路由的應用程式的瀏覽器後退按鈕。出於這些原因，我們不建議在大多數應用程式中使用命名路由。相反，請使用像 go_router 這樣的路由包，或使用 Navigator 與 MaterialPageRoute。

具有高階導航和路由要求的 Flutter 應用程式（例如使用直接連結到每個螢幕的 Web 應用程式，或具有多個 Navigator 小部件的應用程式）應使用像 go_router 這樣的路由包，該包可以解析路由路徑並在應用程式收到新的深層連結時配置 Navigator。

要使用路由器，請切換到 MaterialApp 或 CupertinoApp 上的 router 建構函式，併為其提供 Router 配置。路由包，例如 go_router，通常提供路由配置，並且可以使用如下所示的路由

child: const Text('Open second screen'),
onPressed: () => context.go('/second'),

由於像 go_router 這樣的包是宣告式的，因此它們在收到深層連結時將始終顯示相同的螢幕。

Router 和 Navigator 旨在協同工作。您可以使用 Router API 透過宣告式路由包（例如 go_router）進行導航，或透過呼叫 Navigator 上的 push() 和 pop() 等命令式方法進行導航。

當您使用 Router 或宣告式路由包進行導航時，Navigator 上的每個路由都是基於頁面的，這意味著它是使用 Navigator 建構函式上的 pages 引數從 Page 建立的。相反，透過呼叫 Navigator.push 或 showDialog 建立的任何 Route 都會將一個無頁面路由新增到 Navigator。如果您正在使用路由包，基於頁面的路由始終是可深層連結的，而無頁面路由則不是。

當從 Navigator 中刪除基於頁面的 Route 時，其後的所有無頁面路由也會被刪除。例如，如果深層連結透過從 Navigator 中刪除基於頁面的路由進行導航，則所有無頁面路由（直到下一個基於頁面的路由）也會被刪除。

使用 Router 類應用程式與瀏覽器的 History API 整合，以便在使用瀏覽器的後退和前進按鈕時提供一致的體驗。每當您使用 Router 進行導航時，都會將 History API 條目新增到瀏覽器的歷史記錄堆疊中。按下 後退 按鈕使用反向時間導航，這意味著使用者將被帶到以前使用 Router 顯示的先前訪問的位置。這意味著如果使用者從 Navigator 中彈出頁面，然後按下瀏覽器 後退 按鈕，則先前的頁面將被推回堆疊。

有關導航和路由的更多資訊，請檢視以下資源

• Flutter cookbook 包含多個 導航示例，展示瞭如何使用 Navigator。
• Navigator 和 Router API 文件包含有關如何在沒有路由包的情況下設定宣告式導航的詳細資訊。
• 瞭解導航，Material Design 文件中的一個頁面，概述了設計應用程式導航的概念，包括對前進、向上和時間導航的解釋。
• 學習 Flutter 的新導航和路由系統，Medium 上的文章，描述瞭如何直接使用 Router 小部件，而無需使用路由包。
• 路由器設計文件 包含 Router API 的動機和設計。