相关疑难解决方法(0)

使用mobx创建多个商店并将其注入到组件的正确方法-ReactJs

如Mobx 文档中的建议,我以以下方式创建了多个商店:

class bankAccountStore {
  constructor(rootStore){
    this.rootStore = rootStore;
  }
...

class authStore {
  constructor(rootStore){
    this.rootStore = rootStore;
  }
...
Run Code Online (Sandbox Code Playgroud)

最后以以下方式创建根存储。另外,我更喜欢在master商店构造函数中构造子商店。此外,我发现有时我的子存储必须观察父存储的一些数据,因此我将其传递给子构造函数

class RootStore {
  constructor() {
    this.bankAccountStore = new bankAccountStore(this);
    this.authStore = new authStore(this);
  }
}
Run Code Online (Sandbox Code Playgroud)

通过以下方式提供给应用

<Provider rootStore={new RootStore()}>
  <App />
</Provider>
Run Code Online (Sandbox Code Playgroud)

然后像这样注入组件

@inject('rootStore') 
@observer
class User extends React.Component{
  constructor(props) {
    super(props);
    //Accessing the individual store with the help of root store
    this.authStore = this.props.rootStore.authStore;
  }
}
Run Code Online (Sandbox Code Playgroud)

即使它需要一部分根存储,是否仍是将根存储每次注入组件的正确有效的方法?如果不是,如何将auth Store注入用户组件? …

state-management reactjs mobx mobx-react

5
推荐指数
2
解决办法
3725
查看次数

标签 统计

mobx ×1

mobx-react ×1

reactjs ×1

state-management ×1