Question

我有一个CRUD应用程序，在组件状态下，我保存了用户的名称。现在的问题是：我在表单中有一个用于输入名称的输入字段，当用户单击列表中的 update 用户时，所选用户的名称将出现在输入中字段，然后我无法更改名称，因为输入字段不允许我输入。我删除了一个字母，它会自动重新出现，该如何解决？

在组件的render方法中：

 <div className="col-sm-9">
      <div className="form-check">
          <input name="user_name" ref="user_name" className="form-check-input" type="checkbox" value="1" id="user_name"
                 value={this.state.user_name} onChange={this.onChange} />          
      </div>
  </div>

我的渲染方法之外：

onChange(e) {
    this.setState({[e.target.name]: e.target.value})
}

Answer 1

您是否绑定了onChange方法（我想这是问题所在，您的状态没有得到更新）。如果不是，则：尝试更改为：

onChange = (e) => {
    this.setState({[e.target.name]: e.target.value})
}

或对此：

<div className="col-sm-9">
      <div className="form-check">
          <input name="user_name" ref="user_name" className="form-check-input" type="checkbox" value="1" id="user_name"
                 value={this.state.user_name} onChange={this.onChange.bind(this)} />          
      </div>
  </div>

React我无法更改输入字段的值（如果它具有值）和onChange

1 个答案: