javascript - ReactJS - 使用 .setState 更改嵌套值

Question

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

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

我正在尝试使用类似的方法设置状态，此时只会更新数据:

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 来获取 bool 状态，而不是与复选框关联的值。

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

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