javascript - 如何在嵌套的对象数组Javascript中切换布尔值

Question

我正在尝试处理 SectionList 数据，并且我想在单击相应项目时更改值。这是数据示例

const Person = [
    {
        firstname: "john",
        lastname: "doe",
        items: [
            {
                visible: true,
                foo: "bar"
            },
            {
                visible: false,
                foo: "bar"
            }
        ]
    },
        {
        firstname: "jane",
        lastname: "doe",
        items: [
            {
                visible: false,
                foo: "bar"
            }
        ]
    },
    {
        firstname: "john",
        lastname: "adam",
        items: [
            {
                visible: true,
                foo: "bar"
            },
            {
                visible: false,
                foo: "bar"
            }
        ]
    },
]

让我们讨论它的第一个对象。如果我按下它在设计部分中的 items[0] 上，可见值应该是 false，我按下 item[1] now visible 应该是 true 并且 item[0] 的可见应该是错误的，如果我移动到其他索引对象，那么应该会发生同样的事情，但之前更改的值应该保留在那里。谢谢。这是我到目前为止所做的代码

    let arr = Person?.map((elem) => {
         
          return {
            ...elem,
           
            items: elem?.items?.map(i => {
              if (i.id == item.id) {
                i.visible=false
                return {
                  ...i,
                  visible: !i.visible,
                };
              }
              return i;
            }),
          };
        });

Answer 1

这可能会对您有所帮助。

toggle = (parentItemID, childItemID) => {
  yourArray.map((elem) => {
   if (elem.id === parentItemID) {
    return {
     ...elem,
     item: item.map((item) => {
      item.visible = false
      if (item.id === childItemID) {
      
       return {
        ...item,
        visible: !item.visible,
       };
      }
      return item;
     }),
    };
   }
   return elem;
  });
 };