数组转树
2021-08-15 本文已影响0人
沃德麻鸭
把后端传过来的平铺数组数据处理为tree组件需要的树形数据
首先要补充工具函数，在**`src/utils/index.js`**文件中，补充一个函数tranListToTreeData，如下：
原数据结构
①因为最终要产出树状数据的数组 所以首先要创建一个空数组，而数组中又要包含若干个对象，所以也要创建一个空对象
②建立一个映射关系，使得可以通过id快速找到对应的元素，这时就要对原数组进行遍历 这次遍历只是为了将新对象调整成自己想要的格式（数组中套对象）
首先要给每一项添加一个children属性
然后给空对象赋值，key值是每一项的id,value值是遍历的每一项
实现代码
③这时的空对象中数据的格式就是以每一项的id为key 值，以每一项结果为value值，然后对数组再遍历一次 这次遍历是为了给新数组赋值
如果pid的值为空，说明这一项就是父级，也代表在它的children属性中将会有其他项的pid与这一项id值相对应的子节点会被添加进来，而此时如果遍历到了这一项，需要做的就是将它直接push到新的空数组里让它作为父级准备使用
如果pid不为空就是子节点，那么就将这一项push到id值与之相同的父级children属性中
最后将新数组返回
代码实现
④将这个工具函数导出，并导入到需要的组件中使用即可
