element tree 渲染部门、项目组织树

：：vue html 部分代码

<el-tree

show-checkbox

ref="moduleTree"

:data="moduleList"

key="companyId"

node-key="companyId"

highlight-current

:default-expand-all="true"

node

default-expanded-keys

@check-change="handleCheckProjectChange"

:props="moduleProps"

>

</el-tree>

// 过滤要处理的参数；传给父组建

handleCheckProjectChange(data, node, self){

let f=this.$refs.moduleTree.getCheckedNodes();

this.node_data=f.map(item=>{

return {

grantType:item.type,

storeNo:item.companyId

}

})

this.$emit('sumbmitNode',this.node_data)

},



//接口获取详情数据后，更新到节点上。

this.$refs.moduleTree.setCheckedKeys(p);



处理项目组织树

传item.parentId-0，然后拿到主要key (item.code)

后端数据——》


this.moduleList= tranListToTreeData(res.data.data,'0')


export function tranListToTreeData(list, rootValue) {

  let arr = []

  list.forEach(item => {

    if (item.parentId === rootValue) {

      // 找到之后 就要去着item 下面有没有子节点

      const children = tranListToTreeData(list, item.code)

      if (children.length) {

        // 如果长度大于0 说明找到了子节点

        item.children = children

      }

      arr.push(item)  // 将内容加入到数组中

    }

  })

  return arr

}