在MobX对象数组上进行深度自动运行

时间:2016-11-27 16:18:51

标签: javascript mobx

我在Github上查看了this issue,在stackoverflow上查看了this question,但我仍然不确定如何为我拥有的数据结构触发自动运行。我从存储中获取数据作为json对象。

// Object keys do not change
const sampleData =
[
    {
        "title": "some-title",
        "isActive": true,
        "isCaseSensitive": false,
        "hidePref": "overlay",
        "tags": ["tag1", "tag2"]
    },
    {
        "title": "all-posts",
        "isActive": false,
        "isCaseSensitive": true,
        "hidePref": "overlay",
        "tags": ["a", "b", "c"]
    }
];

class Store {
    @observable data;

    constructor() {
        this.data = getDataFromStorage();
        if (this.data === null) {
            this.data = sampleData;
        }
    }
}

const MainStore = new Store();

autorun(() => {
    console.log("autorun");
    sendPayloadToAnotherScript(MainStore.data);
})

每次将新对象添加到数据数组或更改对象中的任何字段值时,如何运行自动运行?

1 个答案:

答案 0 :(得分:3)

最简单的方法是使用JSON.stringify()递归地观察所有属性:

autorun(() => {
  console.log("autorun");
  // This will access all properties recursively.
  const json = JSON.stringify(MainStore.data);
  sendPayloadToAnotherScript(MainStore.data);
});