如何使用React Hooks更新对象数组中嵌套的tags子数组

可以实现指定tags数组的更新，只需要遵循React 不可变更新原则，逐层拷贝需要修改的结构即可。

原代码错误原因 #

• 逻辑为向数组追加新元素，而非修改指定id对应的数组项
• 嵌套层级访问错误：数组下标id对应的元素是外层对象，其属性键等于id，需通过prev[id][id]才能拿到包含tags字段的内层对象
• 对象展开语法使用错误，没有正确覆盖tags属性

正确实现代码 #

// 全量替换指定id对应的tags为新数组newArrOfTags
setArr(prev => prev.map((item, index) => {
  // 非目标项直接返回
  if (index !== id) return item
  // 逐层拷贝结构，仅替换tags字段
  return {
    [id]: {
      ...item[id],
      tags: newArrOfTags
    }
  }
}))

如果需要给原有tags追加内容而非全量替换，可修改tags赋值逻辑：

tags: [...item[id].tags, '新增的标签']

内容的提问来源于stack exchange，提问作者BadaCorp