Javascript 如何修改对象数组中的对象键值并返回初始数组？

我有以下对象数组。每个对象都是圆环图中的图例元素。我想要实现的是，当我单击一个元素时，

innerRadius

应设置为值2。如果单击另一个元素，则上一个元素的

innerRadius

值应设置为0。因此，最后只有我单击的元素的值应该是2

export const table1 = [
  {
    label: "p",
    angle: 5,
    style: {fill: "#1A3177"},
    innerRadius: 0,
    active: false,
    key: 0
  },{
    label: "ne",
    angle: 2,
    style: {fill: "#79C7E3"},
    innerRadius: 0,
    active: false,
    key: 1
  },{
    label: "nu",
    angle: 2,
    style: {fill: "#12939A"},
    innerRadius: 0,
    active: false,
    key: 2
  },{
    label: "na",
    angle: 1,
    style: {fill: "#FF9833"},
    innerRadius: 0,
    active: false,
    key: 3
  }
]

我已尝试

映射初始数组，应用
过滤器
，
减少
，
拼接
。
到目前为止，对于我单击的所有元素，它返回
innerRadius
值为2的对象数组

 toogleHighlightOn = key => {
    let item = table1.map(i => i)
    let aaa = item.filter(i => i.key === key).reduce(i => i)
    aaa.innerRadius = 2
    const index = item.indexOf(aaa)
    item.splice([index], 1, aaa)

    console.log(aaa)
    console.log(table1)
    return this.setState({
      default: [...item]
    })
  }

let item=table1.map（i=>i）
你想用这个映射做什么？把相同的值映射回来而不做任何更改？
let aaa=item.filter（i=>i.key==key）。reduce（i=>i）
这里你想用reduce做什么？你写了上面的代码吗？如果是这样，我想你应该看看
map
和
reduce
做了什么，因为我认为你不理解他们的行为。如果您认为您知道这一点，请解释您编写的代码，以便我们能够帮助您，因为现在给您提供解决方案可能不会对您有任何帮助。使用地图，我希望创建原始阵列的克隆，并使用过滤器和还原来提取单击的对象。在此之后，我将innerRadius的值传递给2并在数组中替换它…而不是
let item=table1.map（I=>I）
尝试
let item=table1.map（obj=>{…obj}）
。使用参照复制对象。所以，即使您复制了数组，内部对象仍然使用引用引用。非常感谢
toggleHighlightOn = key => {
    table1.forEach(i => i.innerRadius = 0);
    const newElement = table1.find(i => i.key === key);
    if (newElement) {
        newElement.innerRadius = 2;
    }

    return this.setState({
      default: [...table1]
    })
}