很多場景都需要使用樹形數據，比如：一級菜單 - 二級菜單、省-市-區、公司-部門-小組、界-門-綱-目-科-屬-種 等等。
數據結構通常如下所示(以下代碼為ts寫法)：

const groupList: Group[] = [{groupId: '0',groupName: '江西省',isDefaultGroup: '0',children: [{groupId: '0-0',groupName: '贛州市',isDefaultGroup: '0',children: [{groupId: '0-0-0',groupName: '瑞金市',isDefaultGroup: '0',},],},],},{groupId: '1',groupName: '浙江省',isDefaultGroup: '1',children: [{groupId: '1-0',groupName: '杭州市',isDefaultGroup: '0',children: [{groupId: '1-0-0',groupName: '西湖區',isDefaultGroup: '0',},],},],},{groupId: '2',groupName: '江蘇省',isDefaultGroup: '0',children: [{groupId: '2-0',groupName: '南京市',isDefaultGroup: '0',children: [{groupId: '2-0-0',groupName: '中華門',isDefaultGroup: '0',},],},],}, ];

已知groupId為1-0-0如何找到它對應的名字：西湖區呢？？？

思路：

輸入樹形數據、需要匹配的字段、需要匹配字段的值、需要查找的字段。

遍歷數組直到找出groupId為1-0-0的對象。

保存結果并返回需要查找的字段的值。

知識點

閉包

遞歸

實現

// 以下代碼有ts報錯,知道怎么解決的請告訴我const findFieldValue = <T>(treeData: T[], key: string, value: string | number, field: string): string | number | boolean | null => {let res: string | number | null = null;const fn = (treeData: T[], key: string, value: string | number, field: K) => {if (!treeData?.length) return key;for (let index = 0; index < treeData.length; index++) {if (treeData[index][key] === value) {res = treeData[index][field];break;}if (treeData[index]?.children?.length) {fn(treeData[index].children, key, value, field);}}};fn(treeData, key, value, field);return res; }

結果

cosole.log(findFieldValue(treeData, 'groupId', '1-0-0', 'title')) // 西湖區

總結

以上是生活随笔為你收集整理的查找树形数据的某个值的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。