How to navigate in mobx store using react navigation?

Question

I can use this.props.navigation from screen component to navigate. How should I do the similar in mobx store file? Or should I perform navigation in store?

Answer 1

Yes either:

forward the navigation class to the store when calling the method:

// add nivagation parameter to store fucntion:
this.props.store.handleSomething(data, this.props.navigation);

Or you can singleton the navigator (warning only works for one ofc):

return  this.props.store.navigator = nav} />;

after this is rendered it will set the navigator property in the store.

But I would suggest to store all your routing state also in a routing store like this: https://github.com/alisd23/mobx-react-router.

This way you always have easy access to the navigation state and you can be sure everything properly re-renders. (when in render function in components also depends on navigation changes!)