使用mobx的一般是通过组件来划分store,跨组件的store传递则通过Provider。注意,Provider包裹的节点只能有一个,否则就会出错
improt { Provider, } from 'mobx-react';
...
render() {
<Provider store={ store }>
<div>
<MyComponent />
</div>
</Provider>
}
在MyComonent中就通过@inject装饰器引入store,store就会传递到组件的props中去,通过this.props.store获取和上层组件一样的store
@inject('store')
class MyComponet extend Component {
render() {
<div>
{ this.props.store.xxx }
</div>
}
}
属性名是随便定的,像也这样行,使用的时候就变成@inject('myStore')
improt { Provider, } from 'mobx-react';
...
render() {
<Provider myStore={ store }>
<div>
<MyComponent />
</div>
</Provider>
}
如果没有使用Provider或者Provider组件没有加入store属性,就会报错
Error: MobX injector: Store 'store' is not available! Make sure it is provided by some Provider