Flutter中怎么實(shí)現(xiàn)無Context跳轉(zhuǎn)

Flutter中怎么實(shí)現(xiàn)無Context跳轉(zhuǎn)，針對這個問題，這篇文章詳細(xì)介紹了相對應(yīng)的分析和解答，希望可以幫助更多想解決這個問題的小伙伴找到更簡單易行的方法。

背景介紹

Navigator.of(context).push(MaterialPageRoute(builder: (context){   return DemoPage();  }));

在日常的項(xiàng)目開發(fā)中，我們一般push一個新頁面是用上面的方法的，利用Navigator.of(context)來進(jìn)行push或者pop操作。

缺點(diǎn)：這種情況是必須傳context的，目的是為了利用Navigator.of(context)來獲取到NavigatorState對象，然后才能進(jìn)行push或者pop操作。

那如果我要實(shí)現(xiàn)在項(xiàng)目的任何地方都可以push一個新頁面的話，而這個地方有可能獲取不到context，所以這個時候，就需要實(shí)現(xiàn)無context跳轉(zhuǎn)。

解決方案

無context跳轉(zhuǎn)，本質(zhì)就是不必要我們每次都去傳context參數(shù)，然后利用一些操作直接去獲取到當(dāng)前的NavigatorState。

方案1：利用GlobalKey

在Flutter中，利用GolbalKey利用獲取到對應(yīng)Widget的State對象。所以，這里，我們可以通過一個GlobalKey的key值，來獲取到NavigatorState對象。  MaterialApp中包裝了WidgetsApp，而WidgetsApp包裝了Navigator，并且將 Navigator的key屬性作為navigatorKey暴露出來了。所以，我們可以通過設(shè)置navigatorKey，然后利用這個key去獲取到NavigatorState對象。

這里貼一下相關(guān)的源碼，具體的大家可以自己去看源碼。

MaterialApp類：

WidgetsApp類：可以看出，我們定義的navigatorKey，最后是會傳給Navigator的key值，所以我們在外面就可以通過key.currentState()方法來獲取到這里的NavigatorState對象了。

class _WidgetsAppState extends State<WidgetsApp> implements WidgetsBindingObserver { GlobalKey<NavigatorState> _navigator; void _updateNavigator() { _navigator = widget.navigatorKey ?? GlobalObjectKey<NavigatorState>(this); }  @override Widget build(BuildContext context) { Widget navigator; if (_navigator != null) {  navigator = Navigator(  key: _navigator,  initialRoute: WidgetsBinding.instance.window.defaultRouteName != Navigator.defaultRouteName   ? WidgetsBinding.instance.window.defaultRouteName   : widget.initialRoute ?? WidgetsBinding.instance.window.defaultRouteName,  onGenerateRoute: _onGenerateRoute,  onUnknownRoute: _onUnknownRoute,  observers: widget.navigatorObservers,  ); }}

簡單的代碼實(shí)現(xiàn)

1、定義一個GlobalKey< NavigatorState>對象

static GlobalKey<NavigatorState> navigatorKey=GlobalKey();

2、創(chuàng)建MaterialApp的對象的時候，將navigatorKey賦值給MaterialApp。

MaterialApp(   navigatorKey: Router.navigatorKey,)

使用GlobalKey在任意地方獲取NavigatorState對象

navigatorKey.currentState.pushNamed("/login");

方案2：利用NavigatorObserver

NavigatorObserver，看這名字，就知道是可以用來監(jiān)聽Navigator的變化。比如當(dāng)push一個新頁面的時候，Navigator會監(jiān)聽到NavigatorState發(fā)生變化，回調(diào)didPush（）方法。

注意：NavigatorObserver里面定義了一個NavigatorState對象navigator，所以我們可以通過自定義NavigatorObserver，然后直接利用這個navigator對象來做頁面push或者pop操作，這樣的話，我們就不用自己去利用context去獲取navigatorState對象了。

MaterialApp類，提供了navigatorObservers屬性，這樣我們就可以自定義NavigatorObserver去監(jiān)聽Navigator的變化。

NavigatorState類，執(zhí)行instState對象的時候，會將自身賦值到監(jiān)聽的所有observer對象的_navigator里面。

簡單的代碼實(shí)現(xiàn)

1、自定義NavigatorObserver。

class CustomNavigatorObserver extends NavigatorObserver{ static CustomNavigatorObserver _instance; static CustomNavigatorObserver getInstance() { if (_instance == null) {  _instance = CustomNavigatorObserver(); } return _instance; }}

2、創(chuàng)建MaterialApp的對象的時候，將CustomNavigatorObserver賦值給MaterialApp

MaterialApp(   navigatorObservers: [CustomNavigatorObserver()],)

3、使用CustomNavigatorObserver在任意地方進(jìn)行頁面操作

CustomNavigatorObserver.getInstance().navigator.pushNamed("/login");

關(guān)于Flutter中怎么實(shí)現(xiàn)無Context跳轉(zhuǎn)問題的解答就分享到這里了，希望以上內(nèi)容可以對大家有一定的幫助，如果你還有很多疑惑沒有解開，可以關(guān)注億速云行業(yè)資訊頻道了解更多相關(guān)知識。