操作树形数据方法封装：获取树形数据的某个值、给树形数据每层添加属性

前言

对于常规数组来说，我们想要获取某一个值，或者给每层添加属性，只需要使用 fileter、map 等等的方法，相对来说比较简单。

树形数据不同于常规的数组数据，不能确定其内部包含多少个子节点，即children。所以我们在操作树形数据的时候，不同于常规数据。

其实操作树形数据也很简单，其核心就是 递归。

1. 封装获取树形数据的某个值

传参：

• treeData： 树形数据
• key：需要匹配的字段名
• value：需要匹配的字段值
• field：需要查找的字段

        const findValue = (treeData: any, key: any, value: any, field: any) => {let res: any = null;const fn = (treeData: any, key: any, value: any, field: any) => {if (!treeData?.length) return keyfor (let index = 0; index < treeData.length; index++) {if (treeData[index][key] === value) {res = treeData[index][field]break;}if (treeData[index]?.childrenList?.length) {fn(treeData[index].childrenList, key, value, field)}}}fn(treeData, key, value, field)return res}

2. 给树形数据每层添加属性

    const addKey = (treeData: any) => {return treeData.map((item: any) => ({...item,disabled: item.childrenList?.length>0 ? true : false,childrenList: item.childrenList?addKey(item.childrenList) : []}))}

本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场，不承担相关法律责任。如若转载，请注明出处。 如若内容造成侵权/违法违规/事实不符，请点击【内容举报】进行投诉反馈！