Mobx的store传递

2,080 阅读1分钟

使用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