在componentWillUnmount上取消mobx自动运行功能

Question

我的componentDidMount中有以下自动运行函数：

componentDidMount() {
        this.autoUpdate = autorun(() => {
            this.setState({
                rows: generateRows(this.props.data)
            })
        })
    }

问题是，当组件没有挂载时，另一个组件会更改this.props.data --为此，我在未挂载的组件上得到.setState警告。

因此，一旦组件卸载，我想删除自动运行。

我试着做：

componentWillUnmount() {
    this.autoUpdate = null
}

但是自动运行函数仍然会触发。有办法取消mobx自动运行，一旦组件不再挂载？

Answer 1

autorun返回一个处理函数，您需要调用该函数才能取消它。

class ExampleComponent extends Component {
  componentDidMount() {
    this.autoUpdateDisposer = autorun(() => {
      this.setState({
        rows: generateRows(this.props.data)
      });
    });
  }

  componentWillUnmount() {
    this.autoUpdateDisposer();
  }

  render() {
    // ...
  }
}