如何使用JavaScript从与ID匹配的对象的递归数组中找到对象并做出反应?

时间:2020-08-18 22:13:11

标签: javascript reactjs typescript

我的数据如下,

const items = [
    {
        id: '1',
        name: 'item1',
        subItems: [{
            id: '1',
            name: 'subitem-1',
        }],
    },
    {
        id: '2',
        name: 'item2',
        subItems: [{
            id: '2',
            name: 'subitem-1',
        }],
    }
]

现在,我想找到与ID 2匹配的子项。因此,从上面的数据中可以看到预期的输出是

{
    id: '2',
    name: 'subitem-1',
}

我尝试了以下类似的方法,

const subItem = Items.find(
    (item: any) =>
        item.subItems &&
            item.subItems.some(
                (subItem: any) => subItem.id === '2'
            )
);

但是这将返回包含id为'2'的subItem的项目。

如何修复上面的代码,使我得到SubItem而不是item?

有人可以帮我这个忙吗?谢谢。

1 个答案:

答案 0 :(得分:0)

您可以使用以下内容,该内容将仅搜索并返回找到的内部对象。

const items = [
  {
    id: "1",
    name: "item1",
    subItems: [
      {
        id: "1",
        name: "subitem-1"
      }
    ]
  },
  {
    id: "2",
    name: "item2",
    subItems: [
      {
        id: "2",
        name: "subitem-1"
      }
    ]
  }
];

function innerFind(array, key, value) {
  for (const obj of array) {
    const item = obj.subItems.find((el) => el[key] === value);

    if (item != null) return item;
  }
}

console.log(innerFind(items, 'id', '2'));

您传递您的items数组,要搜索的键('id'),然后输入要搜索的值('2')。该函数将返回找到的第一个子项。