将普通数组数据转换为nztree数据_util arrayservice-CSDN博客

本文链接：https://blog.csdn.net/smallNut/article/details/131193490

在数据量级小的情况下可以使用手写的双重for循环逻辑去处理，但处理数据量级大的时候页面会出现长时间的卡顿情况，例如需要处理上千条数据则需要进行百万次的数据循环，这在页面上是不可取的，因此ng-alain针对这种情况定制了ArrayService这个服务
使用的时候将服务注入即可直接使用，需要引入delon工具库

import { ArrayService } from '@delon/util';
constructor(
    private arrayService: ArrayService,
  ) {
    super(PageContext, injector);
  }
this.arrayService.arrToTreeNode(this.finalTree, { parentMapName: 'parent' })

其中还有其他方法例如
treeToArr(将树结构转换成数组结构)
arrToTreeNode(数组转换成 nz-tree 数据源)
visitTree(递归访问整个树)
需要的可直接前往ng-alain官网获取api
https://ng-alain.com/util/array/zh

手动转换

arrToTree(arr, parentid = '0') {
    const res = []
    arr.forEach(item => {
      if (item.parentid == parentid) {
        const children = this.arrToTree(arr.filter(v => v.parentid !== parentid), item.id)
        if (children.length) {
          res.push({ ...item, children })
        } else {
          res.push({ ...item })
        }
      }
    })
    return res
  }