ztree树结构的数据结构如下:
[ { "id": 3990, "name": "泡沫灭火", "iconShow": false, "children": [ { "id": 8616, "name": "泡沫发生器", "iconShow": false, "children": [ { "id": 8617, "name": "水轮机式泡沫发生器", "iconShow": false }, { "id": 8618, "name": "电动机式泡沫发生器", "iconShow": false } ] }, { "id": 8619, "name": "泡沫比例混合器", "iconShow": false, "children": [ { "id": 8620, "name": "压力储罐式泡沫比例混合器", "iconShow": false }, { "id": 8621, "name": "平衡压力式比例混合器", "iconShow": false }, { "id": 8622, "name": "环泵式负压比例混合器", "iconShow": false }, { "id": 8623, "name": "管线式负压比例混合器", "iconShow": false } ] } ] }, { "id": 3946, "name": "沙发", "iconShow": false } ]
过滤后要转换成的目标数据结构如下:
[ { "disabled": false, "text": "泡沫灭火,泡沫发生器,水轮机式泡沫发生器", "id": "3990,8616,8617" }, { "disabled": false, "text": "泡沫灭火,泡沫发生器,电动机式泡沫发生器", "id": "3990,8616,8618" }, { "disabled": false, "text": "泡沫灭火,泡沫比例混合器,压力储罐式泡沫比例混合器", "id": "3990,8619,8620" }, { "disabled": false, "text": "泡沫灭火,泡沫比例混合器,平衡压力式比例混合器", "id": "3990,8619,8621" }, { "disabled": false, "text": "泡沫灭火,泡沫比例混合器,环泵式负压比例混合器", "id": "3990,8619,8622" }, { "disabled": false, "text": "泡沫灭火,泡沫比例混合器,管线式负压比例混合器", "id": "3990,8619,8623" } ]
下面是实现方法:
tree_to_list(ztree, result, temp_ids =[],temp_names =[]){ ztree.forEach(node=>{ if(node.children){ this.tree_to_list(node.children,result, temp_ids.concat([node.id]), temp_names.concat([node.name])) }else{ result.push({disabled:false,text:temp_names.concat([node.name]).join(','),id:temp_ids.concat([node.id]).join(',')}) } }) },
调用如下:
const result = [] tree_to_list(zTree, result) const filter_arr = result.filter(item=>{return item.text.indexOf(this.searchValue) > -1}) console.log(filter_arr)
zTree为树结构数据,filter_arr为二维数组。