时间戳

首页 > 解决方案 > 如何在 React 中访问和更新嵌套对象数组

reactjs - 如何在 React 中访问和更新嵌套对象数组

问题描述

我拥有的对象是

const [folders, setFolders] = useState([
    {
      title: "folder2",
      id: 1,
      child: [
        {
          title: "folder4",
          id: 4,
          child: [
            { title: "folder4", id: 7, child: "" },
            { title: "folder6", id: 8, child: "" },
            { title: "folder5", id: 9, child: "" }
          ]
        },
        { title: "folder10", id: 10, child: "" },
        { title: "folder11", id: 11, child: "" }
      ]
    },
    { title: "folder3", id: 2, child: "" },
    { title: "folder1", id: 3, child: "" }
  ]);

我只想更改文件夹5中子项的属性我该怎么做

标签： reactjs

解决方案

如果您的状态是一个数组，并且您想要更新状态，则做出反应，改变现有数组不会导致重新渲染。

IE

const [names,setNames] = useState(["sreedhar","reddy"]);

//This does not create a rerender
names.push("ac");
setNames(names);

因为当你改变一个数组时，名称的引用不会改变。React 用于Object.is()比较。因此反应认为它不是新状态。

正确的方法是传递一个新数组。喜欢

const [names,setNames] = useState(["sreedhar","reddy"]);

setNames([...names,"ac"]);

要创建一个新数组，您可以使用扩展运算符或映射。

推荐阅读