Vue二次封装element-ui的树组件(二)——将扁平数据变成二维数组

将扁平数据变成二维数组:

<template>
  <div>

  </div>
</template>
<script>
import { getTreeList } from './api'
export default {
  async mounted () {
    let { data } = await getTreeList();
    // console.log(data);
    // 1)扁平数据如何变成多层数据 递归数据
    let AllData = [...data.parent, ...data.child];
    // console.log(AllData);
    //变成映射表
    let treeMapList = AllData.reduce((memo, current) => {
      memo[current["id"]] = current;
      return memo;
    }, {})
    // console.log(treeMapList)
    let result = AllData.reduce((arr, current) => {
      let pid = current.pid;
      let parent = treeMapList[pid];
      if (parent) {
        parent.children ? parent.children.push(current) : parent.children = [current]
      } else if (pid === 0) {  //这是根文件夹
        arr.push(current);
      }
      return arr;
    }, [])
    console.log(result)
  }

}
</script>

发布了98 篇原创文章 · 获赞 4 · 访问量 2万+

猜你喜欢

转载自blog.csdn.net/weixin_42416812/article/details/101023346