Question

我正在探索MobX并对一个问题感兴趣：

如果我有这个可观察的内容：

class ItemsStore {
    @observable items = [1,2,3];
}
const store = new ItemsStore;

然后改变它：

setInterval(() => {
    store.items[0] = +new Date
}, 1000)

我注意到以下内容：

autorun(() => console.log(store.items)); never fires...
autorun(() => console.log(store.items[0])); fires every 1s and gives a new value
autorun(() => console.log(store.items.length)); fires every 1s although value is unchanged

这背后的API逻辑是什么？我希望由于store.items永远不会触发，未更改的属性的行为会相同。

为什么MobX知道回调中的代码是什么？它是否正在分析我传回autorun的回调？

Answer 1

<强>的console.log（store.items）

当更改了上次自动运行中取消引用的可观察对象时，将触发自动运行。 store.items不会取消引用任何可观察者。尝试store.items.slice()或store.items.toJS()以获得所需的效果。

<强>的console.log（store.items [0]）

这被解雇是因为被解除引用的可观察者被改变了。

<强>的console.log（store.items.length）

这是因为MobX阵列不是真正的阵列而运行。 length属性为defined as follows：

Object.defineProperty(ObservableArray.prototype, "length", {
    enumerable: false,
    configurable: true,
    get: function(): number {
        return this.$mobx.getArrayLength();
    },
    set: function(newLength: number) {
        this.$mobx.setArrayLength(newLength);
    }
});

getArrayLength reports that the MobX array has been observed：

getArrayLength(): number {
    this.atom.reportObserved();
    return this.values.length;
}

MobX自动运行行为

1 个答案: