Let's take a class like this in an app with React and React Router.
@observer class Module1 extends React.Component {
constructor (props) {
super(props);
//...
}
componentWillMount(){
//...
}
method(){
//...
}
otherMethod(){
//...
}
render() {
return (
<ChildComp bars={this.props.bars}/>}
);
}
}
And let's take a state like this
state = observable({
module1:{
bars:{
//...
}
},
module2:{
foos:{
//...
}
}
})
The Module1 component is loaded like this:
//index.js
render(
<Router history={browserHistory}>
<Route path="/" component={App}>
<Route path='/map' component={Module1} >
<Route path="/entity/:id" component={SubModule}/>
</Route>
<Route path='/map' component={Module2} >
</Route>
</Router>,
document.getElementById('render-target')
);
How could I pass the props module1.bars to Module1 component?
In redux I would use <provider>and redux-connect but I am a bit lost with this in Mobx.js.