MobX：更新输入字段中的值

Question

我使用一个简单的输入字段，它应该由@observable 值控制：

<div>
    <input value={this.props.appState.myValue} onChange={this.handleChange}/>
    value: {this.props.appState.myValue}
</div>

将 myValue 更新为 undefined 后，显示值发生变化，但输入字段中的值保持不变。

初始状态：

[initial]
value: initial

更新后：

[initial]
value:

Answer 1

我怀疑您没有将组件变成观察者。试试这个例子：

@observer
class App extends React.Component {
  handleChange = (e) => {
    this.props.appState.myValue = e.target.value; 
  };
  render() {
    const { appState } = this.props;
    return (
      <div>
        <input value={appState.myValue} onChange={this.handleChange} />
        value: {appState.myValue}
      </div>
    );
  }
}