React useState更新嵌套对象数组指定字段的正确方法

你的代码有4个核心错误，直接导致更新结果不符合预期：

• 状态初始值写错：useState("obj")传入的是字符串，不是你提前定义的数组变量obj，状态初始类型和预期不符，调用数组方法会直接异常。
• 取值来源错误：找到父项索引后，你没有使用回调参数里的prevObjects（即最新的状态值）取对应项，反而直接引用外部的初始obj变量，很容易取到过期数据。
• 返回结构不完整：你只生成了修改后的obj_of_names子数组，没有把这个子数组嵌回父对象、再组装回完整的顶层数组，setState最终拿到的返回值不是完整的状态结构，只是一层子数组。
• 参数与判断逻辑存在漏洞：从你最终改到了id为c1的项来看，你传入的父项idreqdImgID、子项idreqdID值都传错了，误匹配到了第一个父项下的c1子元素；再加上id判断用了宽松相等==，存在隐式类型转换，进一步提升了匹配错误的概率。另外代码末尾多了一个多余的分号，存在语法问题。

React嵌套状态更新要遵循不可变原则：每一层嵌套的对象、数组都要做浅拷贝，最终返回和原状态结构完全一致的新值，不要直接修改原状态。推荐直接用map遍历实现，逻辑更清晰：

// 修正useState初始值，传入数组而不是字符串
const [newobj, setObj] = useState(obj)

// 更新逻辑
setObj((prevObjects) => {
  // 遍历顶层父数组，返回全新的顶层数组
  return prevObjects.map(parentItem => {
    // 非目标父项直接返回原引用，不需要修改
    if (parentItem.id !== "2") return parentItem
    // 命中目标父项：浅拷贝父项，替换内部的obj_of_names字段
    return {
      ...parentItem,
      obj_of_names: parentItem.obj_of_names.map(childItem => {
        // 非目标子项直接返回原引用
        if (childItem.id !== "d1") return childItem
        // 命中目标子项：浅拷贝子项，更新school字段
        return {
          ...childItem,
          school: "newxyz123"
        }
      })
    }
  })
})

如果你更习惯用findIndex找索引的写法，也可以按下面的方式写，核心是要把每一层修改后的值拼回完整结构：

setObj((prevObjects) => {
  const targetParentIndex = prevObjects.findIndex(item => item.id === "2")
  // 找不到目标父项直接返回原状态，不做无意义更新
  if (targetParentIndex === -1) return prevObjects
  // 浅拷贝顶层数组，避免直接修改原状态
  const newList = [...prevObjects]
  // 生成更新后的子数组
  const updatedChildList = newList[targetParentIndex].obj_of_names.map(child => {
    if (child.id === "d1") {
      return { ...child, school: "newxyz123" }
    }
    return child
  })
  // 替换对应索引位置的父项
  newList[targetParentIndex] = {
    ...newList[targetParentIndex],
    obj_of_names: updatedChildList
  }
  return newList
})

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