在 setState 中更新 object 的嵌套数组

Question

我有一个包含多个对象的数组，我想更新 object 中的任何值。 我能够更新 object 但我的问题是每当我更新阵列内的任何 object 时，父阵列变为 object。 我不想将数组更改为 object。 我正在分享我的代码和 output 和预期的 output。

this.setState({
        tempArray: {
            ...this.state.tempArray,
            [lineNo]: {
                ...this.state.tempArray[lineNo],
                [pointNo]: {
                  ...this.state.tempArray[lineNo][pointNo],
                  x:parseInt(x),
                  y:parseInt(y)
                }
            }
          }
      },
      ()=>{
        console.log('callback tempArray',this.state.tempArray);
      })

如果我将给定数组中的第一个数组 x:7 更改为 x:10

[[{x:7,y:20}],[{x:50,y:60}],[{x:30,y:40}]]

我的 output 是

[{x:10,y:20},[{x:50,y:60}],[{x:30,y:40}]]

但我预期的 output 是

[[{x:10,y:20}],[{x:50,y:60}],[{x:30,y:40}]]

Answer 1

您将[lineNo]设置为 object。 试试这样：

tempArray: {
  ...this.state.tempArray,
  [lineNo]: [ // <--- [ instead of {
    ...this.state.tempArray[lineNo],
    [pointNo]: {
      ...this.state.tempArray[lineNo][pointNo],
      x:parseInt(x),
      y:parseInt(y)
    }
  ]// <--- ] instead of }
}