Question

我有一个状态：

state = {
   obj1: {
       name: "",
       message: "",
   }
}

我有一个表格：

<form>
<input id={obj1.name} onChange={this.handleChange}/>
<input id={obj1.message} onChange={this.handleChange}/>
</form>

关于handleChange：

handleChange(e) {
    const {id, value} = e.target
    this.setState({[id]:value});

}

它不会更新状态中的 obj1，而是创建一个新的状态变量，并且 obj1 不会更新。 [id] : value 适用于不是对象的状态变量。如何通过表单更改实现在对象中设置新状态？

Answer 1

好的，要带走的是 - setState 方法的第二个版本使用以旧状态作为参数的回调。它是这样的：

this.setState(state => ({
  // ... Do your manipulation here
}))

有了这个，您将能够“更新”状态而无需替换它。试着用这个提示自己弄清楚:)

如果可以的话，谢谢！你真棒！查看我所做的沙箱，让我们知道您是否做了不同的事情。如果你做不到，别担心，你绝对很棒！仍然在这里检查沙箱：