js树相关的工具类函数整理

js树相关的工具类函数整理

1、根据树子节点获取完整路径

/**
 * 根据树子节点获取完整路径 
 * @param {*} list 
 * @param {*} code 
 * @param {*} result 
 * @returns array/booolean 
 */
const getTypePath = (list, code, name = "nodeCode", result = []) => {
  let arr = Array.from(result);
  for (let item of list) {
    arr.push(item[name]);
    if (item[name] === code) {
      return arr;
    }
    if (item.children && item.children.length) {
      let tempRes = getTypePath(item.children, code, name, arr);
      if (tempRes) return tempRes;
    }
    arr.pop();
  }
  return null;
};

2、将带有 idName 和 parentIdName 的 list 转换成树级结构的格式

/**
 * 将带有 idName 和 parentIdName 的 list 转换成树级结构的格式
 * @param {*} list
 * @param {*} parentId 可选
 * @param {*} idName 可选
 * @param {*} parentIdName 可选
 * @returns
 */
export function buildTree(list, parentId = null, idName = "id", parentIdName = "parentId") {
  const tree = [];
  for (let item of list) {
    if (item[parentIdName] === parentId) {
      item.children = buildTree(list, item[idName], idName, parentIdName);      tree.push(item);
    }
  }
  return tree;
}

3、通过节点的 id 查找特定的节点

/**
 * 通过节点的 id 查找特定的节点
 * @param {*} tree
 * @param {*} id
 * @param {*} idName 可选
 * @returns */
export function findNodeById(tree, id, idName = "id") {
  for (let node of tree) {
    if (node[idName] === id) {
      return node;
    }
    if (node.children) {
      const foundNode = findNodeById(node.children, id, idName);
      if (foundNode) {
        return foundNode;
      }
    }
  }
  return null;
}

4、搜索所有节点包含content的name字段，并返回节点

/**
 * 搜索所有节点包含content的name字段，并返回节点
 * @param {*} tree 
 * @param {*} content 
 * @returns 
 */
export const filterTreeNodes = (tree, content) => {
  // 用于存储过滤后的节点
  let filteredNodes = [];
  // 递归遍历树的每个节点
  tree.map((node) => {
    let visible = false;
    // 检查节点的名称是否包含指定内容
    if (node.name.includes(content)) {
      //先判断该节点是否包含指定内容
      visible = true;
    }
    // 检查节点是否有子节点
    if (node.children && node.children.length > 0) {
      // 递归调用过滤函数，对子节点进行过滤
      const filteredChildren = filterTreeNodes(node.children, content);
      // 将子节点的过滤结果添加到父节点的子节点列表中
      node.children = filteredChildren;
      //子节点有匹配的内容时，也许添加父节点
      if (filteredChildren?.length) filteredNodes.push(node);
    } else if (visible) {
      // 如果包含指定内容，则将节点添加到过滤后的节点列表中
      filteredNodes.push(node);
    }
  });
  // 返回过滤后的节点列表
  return filteredNodes;
};

5、根据节点的id获取该节点的name

/**
 * 根据节点的id获取该节点的name
 * @param {*} rootNode
 * @param {*} code
 * @return
 */
export const findNodeNameById = (rootNode, code) => {
  for (let m = 0; m < rootNode.length; m++) {
    if (rootNode[m].code === code) {
      return rootNode[m].name;
    }
    if (rootNode[m].children?.length) {
      const foundNodeName = findNodeNameById(rootNode[m].children, code);
      if (foundNodeName) {
        return foundNodeName;
      }
    }
  }
  return null;
};

=待更新=