Question

我有4个存储堆栈溢出示例：

SearchQuestionsStore
RecentQuestionsStore
UserQuestionsStore
CurrentQuestionStore

前3个商店中的每一个都有@observable questionsList = [];

当questionsList填充问题时，可以从这3个商店中的任何一个访问问题。 @observable currentQuestion在CurrentQuestionStore

中保存当前选定的问题

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

问题是这个问题可能存在或可能不存在于其他3个商店questionlists中，所以我想知道使用MobX解决这个问题的最佳方法是什么？因此，如果存在，我们可以在所有商店中更新此questionId = 1的最新计数。更改currentQuestion

上的标题，答案计数或任何其他属性时会出现同样的情况

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

Answer 1

使用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);

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

MobX - 一次更新多个商店数组项？

1 个答案: