How to call Nuvigator from outside of build context?

[acoutts]

With built-in navigator I used GetIt() and a global key to do this, how can I access Nuvigator to navigate screens outside of a build function?

Here's an example:

Run this just before runApp()

void setupLocator() {
  GetIt.instance
      .registerLazySingleton<NavigationService>(() => NavigationService());
}

NavigationService definition:

class NavigationService {
  final GlobalKey<NavigatorState> navigatorKey = GlobalKey<NavigatorState>();
  final GlobalKey<NavigatorState> navigatorKeyAuth =
      GlobalKey<NavigatorState>();

  /// Navigate to a named route with optional [arguments].
  Future<dynamic> pushNamed(String routeName, {Object arguments}) {
    return navigatorKey.currentState.pushNamed(routeName, arguments: arguments);
  }

  /// Navigate to a named route but reset the stack so the user can't go back, with optional [arguments].
  Future<dynamic> pushNamedReset(String routeName,
      {Object arguments, String popUntil}) {
    return navigatorKey.currentState.pushNamedAndRemoveUntil(
        routeName, (route) => route.settings.name == popUntil ?? '/',
        arguments: arguments);
  }
}

Then I can navigate from anywhere using this:

GetIt.instance<NavigationService>().pushNamedReset('/screen_name');

[acoutts]

Forgot above, for my example with the classic navigator you also have to add this navigator key to WidgetsApp/MaterialApp/CupertinoApp:

WidgetsApp(
  ...
  navigatorKey: GetIt.instance<NavigationService>().navigatorKey,
);

[leoiacovini]

While not very recommended to rely on global state outside the Context to get the navigation instance, it's possible. For getting just the Nuvigator, you should be able to do the exact same thing but replacing the NavigatorState with NuvigatorState and passing as a key property to the Nuvigator instance you want.

if you are using the >= 0.3.0 version of Nuvigator, you may be able to save the Router instance passed to the Nuvigator, and form the Router, you are able to use all the navigation methods, and also get the attached Nuvigator instance to it.

[acoutts]

Thanks! Is there a better way I should do things do you think?

I have a state machine in a mobx store to describe the initial process of opening the app and logging the user in, and during some state transitions I need to trigger a navigation. I thought using a global navigator would work here, because I could for example have the following flow:

1) user fills in information and clicks login 2) navigate to loading screen -- At the same time, kick off API requests to pull the user profile / required information to populate the app's state. 3) After API requests are done, then navigate to the main authenticated landing screen.

[acoutts]

I was able to access the Nuvigator instance as you said, but you're right this doesn't feel like a good idea. Mainly, there is a race condition here because if I try to access the Nuvigator too soon, it's still null. I did a simple test with a 2s timeout and it works, but of course I don't want to work around a race condition like this.

[leoiacovini]

There are three main reasons why I would avoid this pattern:

• Reference keeping can be tricky and prone to race-conditions if not properly done.
• GlobalState is going to couple your business logic with UI/NavigationLogic. Here your MobX transition is handling both and this can bring problems to you when wanting to test, you will need to create fixtures and provide a GlobalState of the Navigator set up to be able to test you MobX logic. This ends up making things more complex and eventually, you end up losing control of what is going on and where (you have not a proper separation of concerns). This is a problem for bigger and more complex projects if you feel that this is not the case for your application, that it should be ok to keep this way.
• Working with nested navigators: without getting the instance from the context, and always getting the root one, you will not be able to reach nested Navigators, you will need to keep track of each ones keys, which is complex state management.\

I would suggest maybe to pass callbacks or event the router/nuvigator instance to the mobx handler, so it would just execute it

[acoutts]

Thanks for that! Do you have any more details on your 2 suggestions for things I can read into?

[acoutts]

I think I've got this figured out now, thanks for clarifying @leoiacovini !