处理常见的树形结构的递归方法

一、

后台设计一张分类表的时候，如果有多级分类，通常会这样设计，使用parentId来标注它的父级是哪条数据，而且这种分类往往是不确定多少级：

这种数据，对于后端来说只是一条条数据，而对于前端来说，必须把这样的数据转化为树形数据，此时可以使用递归方法类解决此类问题：

后端传过来的数据：

最终的转化的数据格式如下：

递归算法：

支持无限极分类。

function toArrayTree(array, parentId) {
  if(!Array.isArray(array)) {
    return [];
  }
  let result = [];
  for(let i = 0; i < array.length; i ++) {
    let c = array[i];
    // 拿第一条数据来说，判断第一条的parentId 是否等于传进来的 0，如果等于，
    // 说明第一条数据是第一级，然后接着拿出第一条的id，递归，判断是否有子节点。
    if(Number(c.parentId) === Number(parentId)) {
      result.push(c);
      // 关键：判断c的id下是否有孩子children
      let children = this.toArrayTree(array, c.id)
      if(children.length) {
        c["children"] = children; 
      }
    }
  }
  return result;
}
// data: 后端传过来的数据
// 0: 一级父id，没有上级，一般会与后端约定好，或者后端定好了
toArrayTree(data, 0)

效果如下：

 

二、删除树节点

如果前端树种有删除功能，当删除父节点时，父节点下的所有子节点也需要被删除，这种操作可以使用递归算法来解决

// 递归遍历查找要删除的id result -> []
function getDelateIds(list, id) {
  list.forEach((item, index) => {
    let rowId = item["id"]
    if(rowId === id) {
      // 将目标id存放到结果集数组中
      deleteIds.push(id);
      // 遍历所有子节点
      const children = item.children;
      if(!!children) {
        children.forEach(sonItem => {
          this.getDelateIds(children, sonItem.id);
        })
      }
    }else {
      const children = item.children;
      if(!!children) {
        this.getDelateIds(children, item.id)
      }
    }
  })
  return deleteIds;
}
// list: 树形数据； id：要删除的节点id
getDeleteIds(list, id)