javascript - オブジェクトの MobX 配列でのディープ自動実行

Question

Githubでこの問題を確認し、stackoverflow でこの質問を確認しましたが、データ構造の自動実行をトリガーする方法がまだわかりません。ストレージから 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);
})

新しいオブジェクトがデータ配列に追加されるたび、またはオブジェクトのフィールド値が変更されるたびに自動実行を実行するにはどうすればよいですか?