ReactJS - 使用 .setState 更改嵌套值

Question

我正在尝试设置特定元素（复选框）的状态，以便以后可以将此数据传递回父组件，该父组件将依次更新 JSON 对象。我能够设置更高级别元素的状态，但我不明白如何访问嵌套值。

如何使用 .setState 设置特定元素的状态？如this.state.data[0].checked

我正在尝试使用类似这样的东西来设置状态，目前只会更新data：

handleChange: function(event) {
    this.setState({data: event.target.value}});
  },

Answer 1

看起来你可以使用immutability helpers，如果你使用的是数字/动态键，你应该看看我的question here。

您的解决方案如下所示：

handleChange: function(index, event) {
  var data = React.addons.update(this.state.data, {
   [index]: {
     checked: {$set: event.target.checked}
   }
  });
  this.setState({
    data: data
  })
},

注意复选框使用e.target.checked 而不是e.target.value 来获取布尔状态，而不是与复选框关联的值。

这是您将函数与您必须事先设置的 i 索引附加的方式：

onChange={this.handleChange.bind(this, i)}