将有父子关系的数组数据转换成树形结构

1问题

使用vue开发项目时使用到了element ui组件的树形组件，需要的数据是有树形结构的数据，但是后台返回的数据是有父子关系的数组，需要对数组进行处理是数据能被树形控件识别
原数据：

sider:[
    {label:"一级目录1",id:1,path:"",parentid:0},
    {label:"一级目录2",id:2,path:"",parentid:0},
    {label:"二级目录1-1",id:3,path:"one",parentid:1},
    {label:"二级目录1-2",id:4,path:"two",parentid:1},
    {label:"三级目录2-1",id:5,path:"three",parentid:2},
    {label:"三级目录2-2",id:6,path:"four",parentid:2}
]

2处理方法

dataDeal(treedata){//treedata为原数组
  //最顶级数据（没有父节点）
  var parents=treedata.filter(value=>value.parentid==0);
  //有父节点的数据
  var children = treedata.filter(value=>value.parentid!==0);
  //实现的方法
  var translator = (parents,children)=>{
    //遍历父节点
    parents.forEach(parent=>{
      //遍历子节点
      children.forEach((child,index)=>{
        //如父节点有对应的子节点，就在父节点对象中添加children属性，并将子节点作为属性值，然后子节点作为父节点一层一层遍历下去
        if(child.parentid==parent.id){
          let temp = JSON.parse(JSON.stringify(children));
          temp.splice(index, 1)
          translator([child], temp);
          typeof parent.children !== 'undefined' ? parent.children.push(child) : parent.children = [child]
        }
      })
    })
  }
  translator(parents,children);
  return parents;
}

3结果

处理前数据：

处理后数据：


效果图：