为应用程序创建单个MobX存储的最佳方法是什么？

小编典典

为应用程序创建单个MobX存储的最佳方法是什么？

reactjs

我已经使用MobX和Redux大约6个月了。我发现对于大多数应用程序，我更喜欢MobX的简单性。但是，我喜欢Redux的单一商店概念。我听到其他人评论说他们用MobX创造了一个故事，我正在尝试确定最佳方法。目前，我创建了多个商店，然后将它们导入单个商店。

class UiStore {
  @observable uiData;

  constructor() {
    this.uiData = {}
  }

  @action updateUI = (data) => {
    this.uiData = {
      data: data
    };
  }
}

let uiStore = new UiStore();
export default uiStore;



class Store {
  @observable currentUser;

  constructor() {
    this.auth = authStore;
    this.ui = uiStore;
  }

}

let store = new store();
export default store;

在这里，我基本上创建了各个商店，然后将它们合并到一个商店中，类似于redux reducer的工作方式。

还有另一种/更好的方法吗？我考虑过可能将商店导入到不同的文件中，并将一些方法和数据放在类的上prototype。

阅读 248

2020-07-22

共1个答案

小编典典

我现在使用MobX已经一年多了，基本上可以做到这一点：

1）我有一个通常称为的“母版”或“母版”商店 class Store {...}

2）然后，我在“主”商店中保留了一些较小的商店。

3）我更喜欢在master’s store构造函数中构造子存储。此外，我发现有时我的子存储必须观察父存储的一些数据，因此我将其传递this给子构造函数：

class UserStore {...}
class TodosStore {...}

class Store {
  constructor() {
    this.user = new UserStore(this);
    this.todos = new TodosStore(this);
  }
}

父母保留对孩子的引用，每个孩子都有对父母的引用。

2020-07-22