只用DVA框架,用到antd 中级联选取,遇到后台数据并不是树状结构(后端数据最好是按照生成时间排序下),js处理成树状结构适用于 Cascader组件 结果如下:
[
{
"value": "58c0a3e1c8183a3d9fefd318",
"label": "板凳",
"_id": "58c0a3e1c8183a3d9fefd318",
"children": [
{
"value": "58c0a400c8183a3d9fefd31a",
"label": "方凳",
"_id": "58c0a400c8183a3d9fefd31a"
}
]
},
{
"value": "58c0a3dbc8183a3d9fefd317",
"label": "桌子",
"_id": "58c0a3dbc8183a3d9fefd317",
"children": [
{
"value": "58c0a3eec8183a3d9fefd319",
"label": "圆桌",
"_id": "58c0a3eec8183a3d9fefd319"
}
]
},
{
"value": "58c0a3d2c8183a3d9fefd316",
"label": "床",
"_id": "58c0a3d2c8183a3d9fefd316",
"children": [
{
"value": "58c0a410c8183a3d9fefd31b",
"label": "水床",
"_id": "58c0a410c8183a3d9fefd31b"
}
]
}
]
var data = JSON.parse('[{"_id":"58c0a410c8183a3d9fefd31b","qtext":"","valid":true,"updateAt":"2017-03-09T00:38:40.800Z","createAt":"2017-03-09T00:38:40.800Z","name":"水床","parentId":"58c0a3d2c8183a3d9fefd316","attributes":[],"note":"","cnum":"CATEGORY1703090007"},{"_id":"58c0a400c8183a3d9fefd31a","qtext":"","valid":true,"updateAt":"2017-03-09T00:38:24.594Z","createAt":"2017-03-09T00:38:24.594Z","name":"方凳","parentId":"58c0a3e1c8183a3d9fefd318","attributes":[],"note":"","cnum":"CATEGORY1703090006"},{"_id":"58c0a3eec8183a3d9fefd319","qtext":"","valid":true,"updateAt":"2017-03-09T00:38:06.272Z","createAt":"2017-03-09T00:38:06.272Z","name":"圆桌","parentId":"58c0a3dbc8183a3d9fefd317","attributes":[],"note":"","cnum":"CATEGORY1703090005"},{"_id":"58c0a3e1c8183a3d9fefd318","qtext":"","valid":true,"updateAt":"2017-03-09T00:37:53.247Z","createAt":"2017-03-09T00:37:53.247Z","name":"板凳","parentId":"","attributes":[],"note":"","cnum":"CATEGORY1703090004"},{"_id":"58c0a3dbc8183a3d9fefd317","qtext":"","valid":true,"updateAt":"2017-03-09T00:37:47.447Z","createAt":"2017-03-09T00:37:47.447Z","name":"桌子","parentId":"","attributes":[],"note":"","cnum":"CATEGORY1703090003"},{"_id":"58c0a3d2c8183a3d9fefd316","qtext":"","valid":true,"updateAt":"2017-03-09T00:37:38.494Z","createAt":"2017-03-09T00:37:38.494Z","name":"床","parentId":"","attributes":[],"note":"","cnum":"CATEGORY1703090002"}]');
var rst = [];
data.forEach(v => {
!v.parentId && rst.push({"value":v._id,"label":v.name,"_id":v._id});
})
data.forEach(v => {
v.parentId && getParent(v,rst);
})
function getParent(item, elems) {
if (!elems) {
return;
}
elems.forEach(v => {
if (v._id === item.parentId) {
v.children ? v.children.push({"value":item._id,"label":item.name,"_id":item._id}) : (v.children = [{"value":item._id,"label":item.name,"_id":item._id}]);
} else {
return getParent(item, v.children);
}
})
}
console.log(JSON.stringify(rst));
网友评论