Javascript 组件正在将文本类型的受控输入更改为非受控输入

以下是与此相关的代码片段：

家长：

class PropertyBar extends Component {
  state = {
    selectedCell: graph.selectedCell,
    cellProperties: []
  }

  updateSelectedCell() {
    if (graph.selectedCell != null) {
      this.setState({
        selectedCell: graph.selectedCell,
        cellProperties: Array.from(graph.selectedCell.value.attributes)
      });
    }
  }

  onChangeHandler = (e) => {
    console.log(e.target.value);
    let cellProperties = [...this.state.cellProperties];
    cellProperties[parseInt(e.target.id)] = e.target.value;
    this.setState({cellProperties});
  }

  renderPropertyList() {
    return this.state.cellProperties.map((key, i) => {
      return <PropertyBarItem name={key.nodeName} value={key.nodeValue} onChange={this.onChangeHandler} key={i} id={i} />
    })
  }

类PropertyBar扩展组件{
状态={
selectedCell:graph.selectedCell，
cellProperties:[]
}
updateSelectedCell（）{
if（graph.selectedCell！=null）{
这是我的国家({
selectedCell:graph.selectedCell，
cellProperties:Array.from（graph.selectedCell.value.attributes）
});
}
}
onChangeHandler=（e）=>{
console.log（如target.value）；
让cellProperties=[…this.state.cellProperties]；
cellProperties[parseInt（e.target.id）]=e.target.value；
this.setState（{cellProperties}）；
}
renderPropertyList（）{
返回this.state.cellProperties.map（（key，i）=>{
返回
})
}

儿童：

class PropertyBarItem extends Component {
  constructor(props) {
    super(props);
  }

  render() {
    return (
      <ListItem divider={true} className="property-bar-item">
        <TextField
          id={this.props.id.toString()}
          label={this.props.name}
          value={this.props.value}
          margin="dense"
          onChange={(e) => this.props.onChange(e)}
        />
      </ListItem>
    )
  }
}

类PropertyBarItem扩展组件{
建造师（道具）{
超级（道具）；
}
render（）{
返回(
this.props.onChange（e）}
/>
)
}
}

当我试图更改

的

值时，它会丢失与之配对的原始
标签
，并且我认为它与父组件状态有任何关系

然后我得到了这个错误：一个组件正在将文本类型的受控输入更改为非受控输入。输入元件不应从受控切换到非受控（反之亦然）。在组件的使用寿命内，决定使用受控或非受控输入元件

我知道这可能是因为我的
cellProperties
状态在开始时是一个空数组，但我的子组件在数组中实际存在值之前不会渲染。我对
value
字段执行了三元操作，如
value={this.props.value？this.props.value:“}
，但当我尝试键入时，它总是返回一个空字符串。
因此，我的问题的答案是，因为我正在将
NamedNodeMap
转换为
数组
，因此，我忘记在我的状态下在数组中添加我正在更改的属性

因此，不是
cellProperties[parseInt（e.target.id）]=e.target.value
，我应该分配给的正确值是
cellProperties[parseInt（e.target.id）]。nodeValue=e.target.value

现在一切正常
 现在我正准备写答案：）一个小问题：）顺便说一句，我想你可以接受你自己的答案。@devserkan哈哈，你来得正是时候。上面说我要等两天，但我可以等一次。