项目中要用到属性结构数据,后端返回的数据不是官方默认的数据结构:
<el-tree:data="treeData":filter-node-method="filterNode":props="defaultProps"@node-click="handleNodeClick"></el-tree>
这是文档默认的树形数据结构:
data: [{label: '一级 1',children: [{label: '二级 1-1',children: [{label: '三级 1-1-1'}]}]}, {label: '一级 2',children: [{label: '二级 2-1',children: [{label: '三级 2-1-1'}]}, {label: '二级 2-2',children: [{label: '三级 2-2-1'}]}]}]
后端返回回来的:
[{"id": "1399521221730304","email": "123@qq.com","child": [{"id": "1399659790548992","email": "1234@qq.com","child": [{"id": "1400165901697024","email": "fj@qq.com","child": [{"id": "1400671389548544","email": "fjj@qq.com","child": null}]}]},{"id": "1400156697001984","email": "277@qq.com","child": null}]},{"id": "1399527282712576","email": "147852@qq.com","child": null},]
直接使用数据树形结构展示不出来,可以改变默认展示的数据格式:
defaultProps: {children: 'child',label: 'email'},