javascript - 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

我怀疑您没有将您的组件变成观察者。尝试 this example :

@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>
    );
  }
}