前言:相信小伙伴在使用react.js的过程中,会碰到这种情况,state的值更新了,input框的value值没有更新。因为我们设置的属性是defaultValue={number}
,这种可以实现手动编辑,但是不会随着state值变化而更新,我们将属性更改为value={number}
之后,发现又没办法输入了,这个时候需要使用input的onChange方法去更新
1.在代码中使用input框
<input type="number" value={this.state.number} ref={(input) => (this.input = input)} onBlur={this.inputOnBlur} onChange={this.change} />
2.在change方法中
change = (event) => {
this.setState({
number: event.target.value,
});
};