js版本的无限分类 树形数据 格式化(配合递归)
Posted 虞政博
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了js版本的无限分类 树形数据 格式化(配合递归)相关的知识，希望对你有一定的参考价值。
function genTree(list) {
var temptree = [], tree = [], items = [];
for (var i in list) {
if (!temptree[list[i].did]) {
var trow = {
id: ‘z‘ + list[i].did,
did: list[i].did,
fid: list[i].fid,
text: list[i].text,
iconCls: ‘im_role‘,
children: []
};
temptree[list[i].did] = trow;
items.push(trow);
}
if (list[i].uid > 0) {
temptree[list[i].did][‘children‘].push({
id: list[i].uid,
text: list[i].realname,
iconCls: ‘im_user‘
});
}
}
for (var j in items) {
if (temptree[items[j].fid]) {
temptree[items[j].fid][‘children‘].push(temptree[items[j].did]);
} else {
tree.push(temptree[items[j].did]);
}
}
temptree = null;
items = null;
return tree;
}
var list=[//目录
{did:1,fid:0,text:‘1111‘},
{did:2,fid:1,text:‘2222‘},
{did:3,fid:1,text:‘3333‘},
{did:4,fid:1,text:‘4444‘},
{did:5,fid:3,text:‘5555‘},
{did:6,fid:4,text:‘6666‘},
{did:7,fid:5,text:‘7777‘},
{did:8,fid:3,text:‘8888‘},
{did:9,fid:4,text:‘9999‘},
//目录下面的人
{uid:1,did:2,realname:‘r111‘},
{uid:2,did:9,realname:‘r222‘},
{uid:3,did:2,realname:‘r333‘},
{uid:4,did:6,realname:‘r444‘},
{uid:5,did:7,realname:‘r555‘},
{uid:6,did:8,realname:‘r666‘},
{uid:7,did:9,realname:‘r777‘},
//或者在同一条记录里面,数据需要先排序保证目录在前面
{did:10,fid:1,text:‘1010‘,uid:10,realname:‘r1010‘},
{did:11,fid:10,text:‘1111‘,uid:11,realname:‘r1111‘},
{did:12,fid:11,text:‘1212‘,uid:12,realname:‘r1212‘},
{did:13,fid:12,text:‘1313‘,uid:13,realname:‘r1313‘}
];
var tree=genTree(list);
console.log(tree);
/*
[
{
"id": "z1",
"did": 1,
"fid": 0,
"text": "1111",
"iconCls": "im_role",
"children": [
{
"id": "z2",
"did": 2,
"fid": 1,
"text": "2222",
"iconCls": "im_role",
"children": [
{
"id": 1,
"text": "r111",
"iconCls": "im_user"
},
{
"id": 3,
"text": "r333",
"iconCls": "im_user"
}
]
},
{
"id": "z3",
"did": 3,
"fid": 1,
"text": "3333",
"iconCls": "im_role",
"children": [
{
"id": "z5",
"did": 5,
"fid": 3,
"text": "5555",
"iconCls": "im_role",
"children": [
{
"id": "z7",
"did": 7,
"fid": 5,
"text": "7777",
"iconCls": "im_role",
"children": [
{
"id": 5,
"text": "r555",
"iconCls": "im_user"
}
]
}
]
},
{
"id": "z8",
"did": 8,
"fid": 3,
"text": "8888",
"iconCls": "im_role",
"children": [
{
"id": 6,
"text": "r666",
"iconCls": "im_user"
}
]
}
]
},
{
"id": "z4",
"did": 4,
"fid": 1,
"text": "4444",
"iconCls": "im_role",
"children": [
{
"id": "z6",
"did": 6,
"fid": 4,
"text": "6666",
"iconCls": "im_role",
"children": [
{
"id": 4,
"text": "r444",
"iconCls": "im_user"
}
]
},
{
"id": "z9",
"did": 9,
"fid": 4,
"text": "9999",
"iconCls": "im_role",
"children": [
{
"id": 2,
"text": "r222",
"iconCls": "im_user"
},
{
"id": 7,
"text": "r777",
"iconCls": "im_user"
}
]
}
]
},
{
"id": "z10",
"did": 10,
"fid": 1,
"text": "1010",
"iconCls": "im_role",
"children": [
{
"id": 10,
"text": "r1010",
"iconCls": "im_user"
},
{
"id": "z11",
"did": 11,
"fid": 10,
"text": "1111",
"iconCls": "im_role",
"children": [
{
"id": 11,
"text": "r1111",
"iconCls": "im_user"
},
{
"id": "z12",
"did": 12,
"fid": 11,
"text": "1212",
"iconCls": "im_role",
"children": [
{
"id": 12,
"text": "r1212",
"iconCls": "im_user"
},
{
"id": "z13",
"did": 13,
"fid": 12,
"text": "1313",
"iconCls": "im_role",
"children": [
{
"id": 13,
"text": "r1313",
"iconCls": "im_user"
}
]
}
]
}
]
}
]
}
]
}
]*/
以上是关于js版本的无限分类 树形数据 格式化(配合递归)的主要内容，如果未能解决你的问题，请参考以下文章