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;
}
}

el-tree树结构的数据封装

原文：https://www.cnblogs.com/media/p/14607739.html