1

我正在做这样的事情:

import { observable, action } from 'mobx';

export default class DataStore {
  @observable pageData:object

  @action fetch() {
    superagent.get(url1)
    .send('got url 1', action((err, results) => {
      if (err)
        return;
      this.pageData = this.pageData || {};
      this.pageData.urlData1 = results;
      this.fetchAnother();
    }));
  }

  @action fetchAnother() {
    superagent.get(url2)
    .send('got url 2', action((err, results) => {
      if (err)
        return;
      this.pageData = this.pageData || {};
      this.pageData.urlData2 = results;
    }));
  }
}

这些动作是分开的,因为有时会fetchAnother被自己调用。

我将 store 注入到我的 React 组件类中。当fetch被调用时,包装在其中的第一个异步回调会action更新页面并urlData1呈现。然后调用并执行第二个回调fetchAnother,但不渲染,并且urlData2仅在我以其他方式强制重新渲染时才会显示。为什么,我该如何解决?

4

1 回答 1

3

MobX 不支持向普通对象动态添加字段。使用可观察地图或预先初始化字段:

pageData = { urlData1: null, urlData2: null }
于 2016-09-08T19:11:09.483 回答