flutter頁面間跳轉和傳參-Navigator的使用

flutter頁面間跳轉和傳參-Navigator的使用

概述

flutter中的默認導航分成兩種，一種是命名的路由，一種是構建路由。

命名路由

這種路由需要一開始現在創建App的時候定義

new MaterialApp(
      ....
      routes: {
        "nameRoute":(BuildContext context)=>new SecondPage(),
      },
    );

然后就可以在程序中使用Navigator.pushNamed來跳轉

Navigator.pushNamed(context, "nameRoute");

這種路由的缺點是不能傳遞參數。

構建路由

在push的時候使用自定義方法構建一個路由

Navigator.push(context, new MaterialPageRoute(builder: (BuildContext context){
   return new ThirdPage(title:"請輸入昵稱");
}))

這種方式就可以傳遞參數了。

1. 返回上一頁並攜帶參數

使用Navigator的pop返回可返回上一級，並攜帶一個參數

Navigator.pop(context,"攜帶參數");

2. 接收路由返回的參數

注意push系列的方法返回值是一個Future,可以用來接收參數

Navigator.pushNamed<String>(context, "nameRoute").then( (String value){
   //處理代碼
});

 Navigator.push<String>(context, new MaterialPageRoute(builder: (BuildContext context){

    return new ThirdPage(title:"請輸入昵稱");

  })).then( (String result){

       //處理代碼

  });

3. 用於登錄邏輯到進入app用戶頁面的邏輯

注意，在push頁面時，安卓機自帶的返回鍵使可以直接返回push前的一個頁面，這樣容易產生登錄后又點擊返回鍵退出登錄的情況，為解決這種影響用戶使用的問題，考慮使用下面給出的push方法

Navigator.pushReplacementNamed(context, '/homePage');

使用Navigator.pushReplacementNamed()可以直接替換當前頁面為push進入的頁面，而不是在頁面棧里繼續疊加，進而避免了退出登錄的情況發生，而是直接退出App。

4. 使用一個頁面替換當前的頁面棧

在頁面棧過於深入，而你需要拋棄所有的頁面棧內容，並使用另一個頁面進行替換時，該需求大多出現在退出登錄時，避免出現明明已經退出登錄，但點擊返回鍵還可以重新進入登陸狀態。

Navigator.pushNamedAndRemoveUntil(context, '/loginPage',
                            ModalRoute.withName("/loginPage"));