如何在大查询中显示父子关系的完整层次结构

// 递归查询函数
function getChildren(parentId, data) {
  const children = [];
  for (let i = 0; i < data.length; i++) {
    if (data[i].parentId === parentId) {
      const child = {
        id: data[i].id,
        name: data[i].name,
        children: getChildren(data[i].id, data) // 递归获取子节点
      };
      children.push(child);
    }
  }
  return children;
}

// 数据准备
const data = [
  { id: 1, name: 'Node 1', parentId: null },
  { id: 2, name: 'Node 1.1', parentId: 1 },
  { id: 3, name: 'Node 1.2', parentId: 1 },
  { id: 4, name: 'Node 1.2.1', parentId: 3 },
  { id: 5, name: 'Node 2', parentId: null },
  { id: 6, name: 'Node 2.1', parentId: 5 },
];

// 递归查询树结构
const tree = getChildren(null, data);

// 显示层次结构
function displayTree(node, level) {
  const indent = '  '.repeat(level); // 缩进
  console.log(indent + node.name);
  for (let i = 0; i < node.children.length; i++) {
    displayTree(node.children[i], level + 1); // 递归显示子节点
  }
}

// 在控制台中显示树结构
displayTree(tree[0], 0);