mobex,@inject 仅存储的特定部分
mobex, @inject only specific part of store
目前我正在使用 mobx <Provider store={store} />
,其中 store 包括所有具有 observables 的 mobx store 类。
在组件内部我使用
访问它
@inject("store")
@observe
class MyComponent ....
但这意味着如果我只想访问通知存储,我必须 this.props.store.notification.message
例如,这变得非常冗长。有没有办法只获取通知存储?因为我们注入的是字符串 "store"
而不是对象,所以我看不出有什么方法可以对其进行解构。
决定 post 它作为答案,因为它可能对其他人有帮助:
如 mobx-react (https://github.com/mobxjs/mobx-react) 的文档所示,Provider 可以接受您传递给它的任何 属性,而不仅仅是 "stores".
因此,解决方案是创建一个包含商店的对象,然后使用传播运算符(或您认为合适的任何其他方式)将其传递给 Provider。
const stores = {
storeOne,
storeTwo,
}
return (
<Provider {...stores}>
<MyComponent />
</Provider>
)
如果您正在使用 mobx-react 包并想要注入多个商店 - 只需将商店传递给 @inject 函数,以逗号分隔
@inject('storeOne', 'storeTwo')
我创建了一个带有多个商店注入示例的笔:https://codepen.io/evgen/pen/NgpVMw
目前我正在使用 mobx <Provider store={store} />
,其中 store 包括所有具有 observables 的 mobx store 类。
在组件内部我使用
访问它@inject("store")
@observe
class MyComponent ....
但这意味着如果我只想访问通知存储,我必须 this.props.store.notification.message
例如,这变得非常冗长。有没有办法只获取通知存储?因为我们注入的是字符串 "store"
而不是对象,所以我看不出有什么方法可以对其进行解构。
决定 post 它作为答案,因为它可能对其他人有帮助:
如 mobx-react (https://github.com/mobxjs/mobx-react) 的文档所示,Provider 可以接受您传递给它的任何 属性,而不仅仅是 "stores".
因此,解决方案是创建一个包含商店的对象,然后使用传播运算符(或您认为合适的任何其他方式)将其传递给 Provider。
const stores = {
storeOne,
storeTwo,
}
return (
<Provider {...stores}>
<MyComponent />
</Provider>
)
如果您正在使用 mobx-react 包并想要注入多个商店 - 只需将商店传递给 @inject 函数,以逗号分隔
@inject('storeOne', 'storeTwo')
我创建了一个带有多个商店注入示例的笔:https://codepen.io/evgen/pen/NgpVMw