js数据扁平化和树形（tree）数据, 相互转换

在看之前首先你要先弄明白思路是什么样的, 思路清晰, 看完还能不豁然开朗吗? 答案是肯定的.

一,扁平化数据处理成tree树形结构

什么是扁平化数据?顾名思义,就是你下面看到的,又扁又平没有起伏的,是不是看完提不起一点兴趣?那我来帮你, 要想处理成tree树形结构,其实就好比小蝌蚪找妈妈, 谁的id对应小蝌蚪的pid谁就是小蝌蚪的妈妈,这样的话,你是不是就帮助小蝌蚪找到妈妈了

const jsonData = [
     { id: 1, pid: 0, name: '一级菜单A' },
     { id: 2, pid: 0, name: '一级菜单B' },
     { id: 3, pid: 0, name: '一级菜单C' },
     { id: 4, pid: 1, name: '二级菜单A-A' },
     { id: 5, pid: 1, name: '二级菜单A-B' },
     { id: 6, pid: 2, name: '二级菜单B-A' },
     { id: 7, pid: 4, name: '三级菜单A-A-A' },
     { id: 8, pid: 7, name: '四级菜单A-A-A-A' },
     { id: 9, pid: 8, name: '五级菜单A-A-A-A-A' }
]
treeData(jsonData) {
     const cloneData = JSON.parse(JSON.stringify(jsonData))// 对源数据深度克隆
     return cloneData.filter(father => {
       const branchArr = cloneData.filter(child => father.id === child.pid)// 返回每一项的子级数组
       branchArr.length > 0 ? (father.children = branchArr) : ''// 如果存在子级，则给父级添加一个children属性，并赋值
       return father.pid === 0 // 返回第一层
     })
},

二,tree树形结构处理成扁平化数据

随便找个树形数组就行,自己试试吧

treeToList(tree) {
     var queen = []
     var out = []
     queen = queen.concat(tree)
     while (queen.length) {
       var first = queen.shift()
       if (first.children) {
         queen = queen.concat(first.children)
         delete first['children']
       }
       out.push(first)
     }
     return out
   }

三,取tree树形结构的所有子集

fnTree (arr) { // 取树状数据的所有子集
  return arr.reduce((prev, cur) => {
    return prev.concat(!cur.children ? cur : this.fnTree(cur.children))
  }, [])
},