-
-
Save alexxsanchezm/f42d8d1739b3c5dde5130c0fc9927470 to your computer and use it in GitHub Desktop.
This is a provider which allows to use mobx-react Provider with wix/react-native-navigation.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import { Provider } from 'mobx-react/native'; | |
const SPECIAL_REACT_KEYS = { children: true, key: true, ref: true }; | |
export default class MobxRnnProvider extends Provider { | |
props: { | |
store: Object | |
}; | |
context: { | |
mobxStores: Object | |
}; | |
getChildContext() { | |
const stores = {}; | |
// inherit stores | |
const baseStores = this.context.mobxStores; | |
if (baseStores) { | |
for (let key in baseStores) { | |
stores[key] = baseStores[key]; | |
} | |
} | |
// add own stores | |
for (let key in this.props.store) { | |
if (!SPECIAL_REACT_KEYS[key]) { | |
stores[key] = this.props.store[key]; | |
} | |
} | |
return { | |
mobxStores: stores | |
}; | |
} | |
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import { Navigation } from 'react-native-navigation'; | |
import Provider from './lib/MobxRnnProvider'; | |
import store from './store'; | |
import HomeScreen from './screens/HomeScreen'; | |
export default function startApplication() { | |
Navigation.registerComponent('myapp.HomeScreen', () => HomeScreen, store, Provider); | |
Navigation.startSingleScreenApp({ | |
screen: { screen: 'myapp.HomeScreen' } | |
}); | |
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import AuthStore from './AuthStore'; | |
import UserStore from './UserStore'; | |
export default { | |
auth: new AuthStore(), | |
users: new UserStore() | |
}; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import { Component } from 'react'; | |
import { Text } from 'react-native'; | |
import { inject, observer } from 'mobx-react/native'; | |
@inject('users') | |
@observer | |
export default class UserScreen extends Component { | |
render() { | |
const { users } = this.props; | |
return ( | |
<Text>Users count: {users.length}</Text> | |
); | |
} | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment