This repo aims to show one of the ways you can use mobx-state-tree (MST) with react-navigation. The code is intended to be approachable to people who are new to react-native and react-navigation. Please note that MST is not used to store the navigation state itself - just the navigation params.
https://exp.host/@vonovak/mst-demo
The demo showcases:
- using a
NavigationService
(docs) - navigation state persistence (docs)
- handling of navigation params and their persistence with MST (docs)
observer
,Provider
andinject
from mobx-react- styled-components
The goal of this demo is to show how you can use react-navigation and MST to achieve optimal developer experience (DX): react-navigation's built-in mechanism persists the navigation state which you can take advantage of during development: a full JS reload will take you back to the screen where you left off before the reload. Navigation params used by the screens are persisted using MST's own (de)serialization features. You can, of course, also take advantage of hot reloading, which is especially helpful for adjusting the look of individual react components.
There are four screens to navigate to:
- HomeScreen
- RepoScreen
- UserScreen
- SettingsScreen
- install expo cli
- clone and run
yarn
- run
yarn start