0

我有 4 个商店用于堆栈溢出示例：

SearchQuestionsStore
RecentQuestionsStore
UserQuestionsStore
CurrentQuestionStore

前 3 家门店各有一个@observable questionsList = [];

questionsList当填充有问题时，可以从这 3 个商店中的任何一个访问问题。An@observable currentQuestion将当前选定的问题保存在CurrentQuestionStore

如果用户支持currentQuestion，我们只需使用 增加当前问题的计数CurrentQuestionStore.currentQuestion.upvotes++，但这并不反映其他 3 个商店中的最新支持计数。

问题是其他 3 家商店中可能存在也可能不存在这个问题questionlists，所以我想知道使用 MobX 解决这个问题的最佳方法是什么？因此，我们可以更新questionId = 1所有商店的最新计数（如果存在）。更改标题、答案计数或任何其他属性时也会出现同样的情况currentQuestion

一次反映跨商店的任何属性变化的最佳方式是什么？

4

1 回答 1

2

使用 MobX，您永远不应该拥有同一事物的两个副本。应该从所有商店引用相同的问题对象。要实现这一点，这将取决于您的代码如何设置以加载和存储问题。

我建议这样做的一种方法是AllQuestionsStore在地图中包含所有问题：

class AllQuestionsStore {
  @observable questionsMap = asMap({});

  @action addQuestion(question) {
    const map = this.questionsMap;
    if (map.has(question.id)) {
      extendObservable(map.get(question.id), question);
    } else {
      map.set(question.id, question);
    }
    return map.get(question.id);
  }
}

然后，无论何时创建或加载问题，都应将其添加到此商店。例如，当您从服务器加载用户问题时：

function loadedUserQuestions(userQuestions) {
  const questions = userQuestions.map(AllQuestionsStore.addQuestion, AllQuestionsStore);
  UserQuestionsStore.questionsList = questions;
}

如果你想设置当前问题：

CurrentQuestionStore.currentQuestion = AllQuestionsStore.addQuestion(question);

现在保证一个问题只有一个实例，所以如果你更新它，其他商店永远不会过时。

于 2016-11-28T06:53:24.050 回答