Mobx 计算不起作用

Question

我正在使用 mobx 4.2.0 当我尝试使用计算属性时，我遇到了一些问题代码如下：

class ODOM {
  constructor(props) {
    console.log('how many times')
  }
  @observable speed = 0
  @action change(obj) {
    console.log(obj)
    Object.keys(obj).forEach(item => {
      this[item] = obj[item]
    })
  }
  @computed get velocity() {
    console.log('entry')
    return this.speed*60*60/1000
  }
}
const model = new ODOM()
let total = 0
setInterval(() => {
  model.change({
    speed: ++total
  })
}, 3000)
export default model

控制台'entry'仅运行一次这些代码有什么问题

Answer 1

我发现 problem.Cause 观察者没有正确使用。

Answer 2

Computed re-calculation 仅在直接在 render 函数中使用此属性的组件中由 mobx 触发，并且这些 react 组件必须使用 @observer 属性进行注释。

否则使用非 computed/normal 属性或自己缓存值。

Answer 3

必须观察您的计算，以便在它所依赖的可观察量发生变化时重新计算它。

This example uses an autorun 显示行为：

class ODOM {
  @observable speed = 0

  @action change(obj) {
    Object.keys(obj).forEach(item => {
      this[item] = obj[item]
    })
  }

  @computed get velocity() {
    console.log('entry')
    return this.speed*60*60/1000
  }
}

const model = new ODOM()
let total = 0
setInterval(() => {
  model.change({
    speed: ++total
  })
}, 1000);

autorun(() => {
  console.log(model.velocity);
});

Answer 4

如果@withRouter 在@observer 下将使@observer,@computed 失败像这样（错误）：

@observer 
// @ts-ignore
@withRouter

你需要这样写（正确）：

// @ts-ignore 
@withRouter
@observer

Mobx 计算不起作用

Mobx computed doesn't work

javascript

mobx