文章目錄
- 1 .概念介紹
- 2. 實現方法
- 3. 示例代碼
我們在上一章回中介紹了在頁面之間共傳遞數據相關的內容,本章回中將介紹如何攔截路由.閑話休提,讓我們一起Talk Flutter吧。
1 .概念介紹
本章回中介紹的路由攔截是指在路由運行過程中,對路由做一些處理。在Flutter中通過路由來實現頁面之間的跳轉,如果想在跳轉過程中做一些事情怎么辦呢?那么就
需要路由攔截了。本章回中將詳細介紹如何實現路由攔截。
2. 實現方法
通常情況下路由都存放在MaterialApp組件的routes屬性中,我們也叫它路由表,該表中的內容明確指出了路由的方向,如果遇到一些不在路由表中的路由,不知道它
的方向,那么就可以對這種路由進行攔截。MaterialApp組件提供了兩個屬性:onGenerateRoute和onUnknownRoute。這兩個屬性都是方法類型,詳細如下:
- 方法返回的值就是路由的方向,或者說路由跳轉到的頁面;
- 方法的參數中包含路由參數中內容,比如路由名稱,路由參數等;
- onGenerateRoute屬性優先于onUnknownRoute執行;
- 如果onGenerateRoute屬性已經攔截了路由,那么onUnknownRoute屬性不再重復攔截;
最后我在強調一下,這兩個屬性對應的方法只能攔截不在路由表中的路由,而且需要和pushNamed方法配合使用才可以。稍后我們將通過示例代碼來演示。
3. 示例代碼
///主要用來攔截不在routes屬性中定義的路由,需要和pushNamed方法配合使用才能回調該屬性對應的方法
onGenerateRoute:(settings) {if(settings.name == 'SecondRouter') {debugPrint('setting: ${settings.toString()}');return MaterialPageRoute(builder: (context){return SecondRouter(data: 'data from home');},///如果路由中包含參數,一定要給這個屬性賦值,不然路由中的參數為nullsettings: settings);}else {debugPrint('setting: ${settings.toString()}');return null;}
},
///主要用來攔截不在routes屬性中定義的路由,需要和pushNamed方法配合使用才能回調該屬性對應的方法
///優先級低于onGenerateRoute,只有onGenerateRoute方法返回Null時才回調此屬性對應的方法
onUnknownRoute: (settings) {debugPrint('unknown setting: ${settings.toString()}');return MaterialPageRoute(builder: (context){///這里可以創建一個未知錯誤的界面,遇到未知路由則跳轉到該界面return SecondRouter(data: 'data from home');});
},onPressed: () {debugPrint('second router clicked');///創建兩個路由,SecondRouter不會被攔截,因為routers屬性對應的路由表中有該屬性///ThirdRouter會被攔截,因它不在路由表中,先是onGenerateRoute攔截,但是沒有處理,轉到onUnknownRoute中Navigator.pushNamed(context, 'SecondRouter',arguments: 'data from arguments');Navigator.pushNamed(context, 'ThirdRouter',arguments: 'data from arguments');
}
上面的代碼中給出了路由攔截的代碼,并且添加了詳細的注釋。onPressed屬性中的代碼可以放到Button中,這樣可以在點擊按鈕的時候進行通過路由來跳轉。代碼中
攔截攔截路由后只打印出了路由中的參數,大家可以依據項目需求在這里添加一些業務邏輯。這里只列出了核心代碼,完整的代碼可以到Github上查看main.dart文件。
看官們,關于"如何攔截路由"相關的內容就介紹到這里,歡迎大家在評論區交流與討論!