后台将一个树状结构的数据,返回成了一个列表;
如何将这个列表封装为树形结构呢?
<script> var data = [{ "area_id": 5, "name": "广东省", "parent_id": 0, }, { "area_id": 6, "name": "广州市", "parent_id": 5, }, { "area_id": 7, "name": "深圳市", "parent_id": 5, }, { "area_id": 4, "name": "北京市", "parent_id": 3, }, { "area_id": 3, "name": "北京", "parent_id": 0, }, ] function setTreeData(arr) { // 删除所有的children,以防止多次调用 arr.forEach(function (item) { delete item.children }); let map = {}; //构建map arr.forEach(i => { map[i.area_id] = i; //构建以area_id为键 当前数据为值 }); let treeData = []; arr.forEach(child => { const mapItem = map[child.parent_id]; //判断当前数据的parent_id是否存在map中 if (mapItem) { //存在则表示当前数据不是最顶层的数据 //注意: 这里的map中的数据是引用了arr的它的指向还是arr,当mapItem改变时arr也会改变,踩坑点 (mapItem.children || (mapItem.children = [])).push(child); //这里判断mapItem中是否存在child } else { //不存在则是顶层数据 treeData.push(child) } }) return treeData } console.log(setTreeData(data))