企业🤖AI智能体构建引擎,智能编排和调试,一键部署,支持私有化部署方案 广告
[TOC] >[success] # 树形结构,根据id筛选某一条数据 项目中遇到了一个树需要做展开收起功能,但是数据结构是树形的(对象的属性children又是一个对象那种)数据如下: ~~~ let data = [{ "id": "1", "label": "第1层数据", "code": "100001007002002", "type": "o", "sort": 30, "children": [{ "id": "1.1", "parentId": "1", "label": "第1层数据", "type": "u" }, { "id": "1.2", "parentId": "1", "label": "第2层数据", "code": "100001007001001007", "type": "o", "sort": 30, "children": [{ "id": "1.2.1", "parentId": "1.2", "label": "第3层数据", "type": "u" }] }] }] ~~~ ~~~ 假如现在只有一个'id'如何取到某一层的数据, 实现如下: ~~~ ~~~ /** * 根据id获取某层节点数据 * @param {Array} arr - 要过滤的id, * @param {Array} data - 要过滤的数据源 * @param {Array} city - 最终过滤后的返回值 */ function getCity(arr, data, city = []) { if (typeof data === "object") { if(arr instanceof Array){ // 过滤条件为数组 for (let i = 0; arr[i] !== undefined; i++) { for (let j = 0; data[j] !== undefined; j++) { if (arr[i] === data[j].id) { city.push(data[j]); } } }; }else{ // 过滤条件不是数组 for (let j = 0; data[j] !== undefined; j++) { if (arr === data[j].id) { city.push(data[j]); } } } for (let i = 0; data[i] !== undefined; i++) { getCity(arr, data[i].children, city); }; } return city; } ~~~ 使用时候这样写: ~~~ 为了灵活性可以用2中传参方式: let filter = getCity(['1.2.1', '1.2'], data) // 1.2.1和1.2的数据 let filter = getCity('1.2.1', data) // 第三层数据 需要注意地方: 1. 如果需要过滤的数据的id是'字符串'写的形式必须是字符串形式,如果是'number'必须是'number'形式, 不然会找不到数据的 2. 还有就是数据里的'children'和'id'有可能叫别的名字,这块主要看数据字段名称叫啥吧 ~~~