Javascript 通过嵌套表单更新对象

我有一个API，可以获取如下对象：

{
    "objectAttributes": [
      {
        "id": "1",
        "Name": "First",
        "Comment": "First"
      },
      {
        "id": "2",
        "Name": "Second",
        "Comment": "Second"
      }
    ]
}

我有一个父组件，它通过.map呈现子组件。子组件将显示所有对象属性

现在我必须更新每个单独的对象属性注释

我正在使用带有onChange处理程序的输入元素进行回调，以将子属性推送到父属性

子回调：

  CommentChanged (val) {
    this.setState({ Comment: val })
    this.props.newServiceComment(this.state.Comment) // pass props to parent
  }

  // push one Comment to objectAttributes
  addServiceComment (Comment) {
    this.state.objectAttributes.push(Comment)
  }

儿童输入表格：

    <Input
      onChangeText={this.CommentChanged}
      ref='Comment'
      value={this.props.Comment}
    />

父渲染部分：

  { objectAttributes.map(service =>
    <Child
      serviceKey={service.id}
      serviceName={service.Name}
      // add ServiceComment to parent
      newServiceComment={service.Comment}
    />
  )}

---

如何将更新属性分配给正确的对象属性。

当使用react通过迭代动态创建元素时，每个创建的元素都应具有唯一的键属性。 这使得react能够区分不同的元素。 您将找到有关此的更多信息

您的问题可能在其他地方，但如果没有更多代码，则很难排除故障。

类父类扩展了React.Component{ 构造器{ 超级作物 此.state={ 对象属性：[ { id:1， 姓名:第一,， 评论：首先 }, { id:2， 姓名:第二,， 评论：第二 } ] } } 瓦尔汉德勒昌吉{ const newArray=this.state.objectAttributes； newArray[i].Comment=val； 这是我的国家{ objectAttributes:newArray } } 渲染{ 回来 {this.state.objectAttributes.mapob，i=> {Comment for+i+object}-{ob.Comment} } 使用下面的子组件更改注释值。每个输入都是一个子组件。 {this.state.objectAttributes.mapob，i=> } } } 子类扩展了React.Component{ 渲染{ 回来 在此处更改评论表单- this.props.handleChangethis.props.index，e.target.value}value={this.props.ob.Comment}/> } } ReactDOM.render , document.getElementByIdapp

---

那么您的问题是什么？您是否为您的子元素分配了一个键？添加代码可以帮助澄清您的问题非常感谢。Great@ClausShapeshifter很高兴这有帮助。这个答案花了我很多时间：