flutter中的路由跳轉

在前面的基本路由和命名路由中，都演示了如何進行路由跳轉，並且在路由跳轉以后，可以借用系統自帶的按鈕就行返回上一級，當然了，也可以自定義按鈕返回上一級。

返回上一級

在前面的例子中，當從Home.dart頁面跳轉到Search.dart頁面后，除了系統自帶的返回按鈕，我們還自定義了一個按鈕，然后使用Navigator.of(context).pop()開返回上一級頁面。

       

路由替換

在實際項目中，僅僅上面的路由跳轉和返回上一級是不能滿足需求的，例如在一個項目中，有一個注冊的需要，用戶在用戶中心點擊注冊按鈕后，跳轉到注冊頁面，但是我們知道，注冊是需要分幾個步驟完成的：

假設注冊需要分上面的三個步驟，那么當用戶在第二個步驟或者第三個步驟的時候，突然不想注冊，於是點擊左上角的返回，是希望返回到用戶中心，而不是上一個注冊步驟，此時，僅僅依靠前面的路由跳轉是不能實現的，而是要借助flutter的路由替換功能。

    

 

首先是在用戶中心頁面，點擊注冊按鈕，跳轉到registerFirst 的頁面。

然后在registerFirst 的頁面，輸入手機號以后，點擊下一步，跳轉到registerSecond的頁面。

這個時候在registerSecond的頁面，點右上角的返回，退出注冊時，就會返回到registerFirst 的頁面，如果我們此時想要返回到用戶中心頁面的話，就需要在registerFirst 的頁面，使用路由替換來進行頁面跳轉，因為registerFirst 頁面的上一級就是用戶中心，當使用registerSecond頁面替換registerFirst 頁面的時候，registerSecond頁面的上一級就是用戶中心頁面了。

返回根路由

比如我們從用戶中心跳轉到 registerFirst 頁面，然后從 registerFirst 頁面跳轉到 registerSecond頁面，然后從 registerSecond 跳轉到了 registerThird 頁面。這個時候我們想的是 registerThird注冊成功后返回到用戶中心。 繼續采用上面的邏輯的話，就是在 registerSecond 跳轉到了 registerThird 頁面時，繼續使用路由替換，這樣，當在registerThird注冊成功后，使用返回上一級的方式，就可以直接返回到用戶中心了。

但是，如果不采用路由替換的話，還有沒有辦法，直接一步返回到根目錄呢，（是返回，而不是路由跳轉），在其他的框架里面可能沒有辦法，但是在flutter中，有一個直接返回根路由的方法，只需要我們在registerThird頁面，返回前先清空前面的路由，然后一步返回就可以了。

 但是，此時還有一個新的問題，我們是從用戶中心開始注冊的，當注冊完成后，是希望能直接回到注冊中心，但是在上面的操作中，直接返回到了tab的第一頁面，因此，還需要繼續修改Tabs.dart頁面：

然后在registerThird 頁面返回根目錄的時候，寫入需要返回tab的索引就可以了：

 代碼下載：點這里（w033）