javascript中无限分类递归树
摘抄:https://www.cnblogs.com/silfox/p/11411680.html(原文)
列表转换成树形结构方法定义:
1 //javascript 树形结构 2 function toTree(data) { 3 // 删除 所有 children,以防止多次调用 4 data.forEach(function(item) { 5 delete item.children; 6 }); 7 8 // 将数据存储为 以 id 为 KEY 的 map 索引数据列 9 var map = {}; 10 data.forEach(function(item) { 11 // 在该方法中可以给每个元素增加其他属性 12 item.text = item.name; 13 map[item.id] = item; 14 }); 15 // console.log(map); 16 17 var val = []; 18 data.forEach(function(item) { 19 20 // 以当前遍历项,的pid,去map对象中找到索引的id 21 var parent = map[item.pid]; 22 23 // 好绕啊,如果找到索引,那么说明此项不在顶级当中,那么需要把此项添加到,他对应的父级中 24 if (parent) { 25 // 可以给每个父节点添加属性 26 parent.iconCls = "i-folder"; 27 // 添加到父节点的子节点属性中 28 (parent.children || (parent.children = [])).push(item); 29 30 } else { 31 //如果没有在map中找到对应的索引ID,那么直接把 当前的item添加到 val结果集中,作为顶级 32 val.push(item); 33 } 34 }); 35 return val; 36 }
树形结构数据
1 var data = [ 2 { 3 id:1, 4 name :"一级分类:1", 5 pid :0, 6 }, 7 { 8 id:2, 9 name :"二级分类:1", 10 pid :1, 11 }, 12 { 13 id:3, 14 name :"三级分类:3", 15 pid :2, 16 }, 17 { 18 id:4, 19 name :"一级分类:2", 20 pid :0, 21 }, 22 { 23 id:7, 24 name :"f级分类:2", 25 pid :4, 26 }, 27 { 28 id:10, 29 name :"f级分类:2", 30 pid :7, 31 }, 32 { 33 id:9, 34 name :"f级分类:2", 35 pid :10, 36 }, 37 { 38 id:12, 39 name :"f级分类:2", 40 pid :9, 41 }, 42 { 43 id:15, 44 name :"f级分类:2", 45 pid :12, 46 }, 47 { 48 id:13, 49 name :"f级分类:2", 50 pid :15, 51 }, 52 ]