在父对象内定位嵌套对象属性

Question

我正在尝试更改多个日期的开/关时间（以及向端点发送的信息）的状态，这些状态会在这样的对象中返回给我：

我已经在React组件中渲染了这些：

{this.state.time.map(each => (
    <Fragment key={each.code}>
        <OpeningHours
            code={each.code}
            day={each.description}
            name={each.code}
            open={each.open !== null ? each.open : '00:00'}
            close={each.close !== null ? each.close : '00:00'}
            onChange={this.onTimeChange}
        />
    </Fragment>
))}

在找到this天的开始或结束时间的索引之前，如何遍历对象数组？到目前为止，我已经尝试过了，但是只有在只有开放时间或一个领域的情况下，这种方法才有效。由于我要编辑2个字段，因此出现了问题：

onTimeChange(e) {
  let inputs = this.state.inputs.slice();
  for(let i in inputs){
      if(inputs[i].name == event.target.name){
          inputs[i].value = event.target.value;
          this.setState ({inputs});
          break;
      }
  }
}

Answer 1

 const newInputs = inputs.map(p =>

      p.name === <unique_name/code>
        ? { ...p, [e.target.name]: e.target.value }
        : p
    );
    this.setState({inputs:newInputs,});

更改onTimeChange（）方法以获取唯一名称：onTimeChange(e, code)

一个简单的示例：https://codesandbox.io/s/v1y14rl2oy

由于索引是唯一的，所以可以做到

inputs[index] = { ...inputs[index], [e.target.name]: e.target.value } 也无需在沙箱中使用map()。