Mobx 监听一个值的变化与计算不起作用

Mobx listen to a value changes with computed does not work

我正在尝试使用 mobx 计算表达式来监听值的变化,但是当我将新值推送到观察到的表达式时,我没有看到任何变化。

class List {
  @observable values = [];

  constructor() {
    computed(() => this.values).observe(changes => {
      console.log(changes);
    })
  }


  add(item) {
    this.values.push(Math.random());
  }

}

const list = new List();
list.add();

为什么不起作用?

computed is used when you want to derive a new value from other observables. You could use observe 改为:

示例 (JSBin)

class List {
  @observable values = [];

  constructor() {
    observe(this.values, (change) => {
      if (change.added) {
        console.log(`${change.added} got added to values`);
      }
    });
  }

  add(item) {
    this.values.push(Math.random());
  }
}

const list = new List();

setInterval(() => {
  list.add();
}, 1000);

请注意,computed 只会跟踪它实际访问的数据。在您的计算中访问的唯一数据是 changes,一个指向数组的指针。将新值推送到该数组不会更改指针。

记住:计算产生值,反应和自动运行产生副作用。

您的计算永远不会产生新值,因此永远不会触发 observer