使用回调处理设置状态的 Mobx 方法是什么

Question

我正在尝试将使用设置状态的现有应用程序转换为使用 Mobx。如何使用 mobx 实现设置状态回调功能。我需要使用 componentDidUpdate 来实现这个功能吗？

Answer 1

你是对的，当组件被 MobX 重新渲染时，你需要使用 componentDidUpdate 来执行自定义逻辑。可观察值将同步更新，但组件将像往常一样异步重新渲染。

示例 (JSBin)

@observer 
class App extends Component {
  @observable value = ''

  componentDidMount() {
    setTimeout(() => this.value = 'focus', 1000);
  }

  componentDidUpdate() {
    this.ref.focus();
  }

  render() {
    return (
      <input
        ref={ref => this.ref = ref}
        value={this.value}
        onChange={e => this.value = e.target.value}
      />
    );
  }
};