reactjs - Mobx 状态树嵌套存储注入

Question

我有一个使用 mobx-state-tree 的问题。如果我们有以下结构的嵌套商店

login(store):{
    //some primitives
},
mainPage(store):{
    slider:(store):{
        //some primitives
    },
    userList:(store):{
        //some primitives
    },
    //some primitives
},

我们如何注入just userListstore。我试着这样做：

@inject('mainPage.userList')

但它会引发错误

Answer 1

如果没有直接引用，您不能直接注入子商店。您可以简单地注入 mainPage 然后在构造函数中访问它。

@inject('mainPage')

然后

constructor(props) {
    super(props)
    this.userList = this.props.mainPage.userList
}

一项改进是拥有一个 rootStore，并且仅通过提供者将其注入每个组件。这简化了测试，每个组件都可以访问整个树。

查看入门文档，您可以看到使用 rootStore 的各种示例：

https://github.com/mobxjs/mobx-state-tree/blob/master/docs/getting-started.md