el-tree树结构的数据封装

返回数据类型:
[
{label:'第一级',id:'1'}
{label:'1-1',id:'2',pId:'1'}
{label:'1-1-1',id:'3',pId:'2'}
]

组件处理:
template中:

<el-tree :data="menu" />

computed:{

//  datalist为接口返回值

  menu: function() {

  if (this.dataList&& this.dataList.length > 0) {
return this.menuC(this.uTreeList);
} else {
return [];
}
}

}

methods:{

// menu 数据处理
menuC(data) {
const fatherMenu = data.filter((item) => !item.pId);
const childrenMenus = data.filter((item) => item.pId);
this.fatherNode(fatherMenu, childrenMenus); // 处理父子
  this.childrenNodes(childrenMenus); // 深度处理子与子
return fatherMenu;
},
fatherNode(f, c) {
f.map((i) => {
item.children = [];
c.map((ii) => {
if (ii.pId === i.id) {
i.children.push(ii);
}
});
});
return f;
},
childrenNodes(c) {
c.map(i => {
ite.children = [];
c.map(ii => {
if (ii.pId === i.id) {
i.children.push(ii);
}
});
});
return c;
}
}
原文地址:https://www.cnblogs.com/media/p/14607739.html