el-tree嵌套el-tree

el-tree嵌套el-tree是指在el-tree组件中嵌套另一个el-tree组件。这种嵌套可以用于创建树形结构的多级菜单或者展示复杂的数据关系。

以下是一个示例代码，演示了如何使用el-tree嵌套el-tree：

<template>
  <div>
    <el-tree :data="treeData" :props="treeProps" node-key="id">
      <template v-slot="{ node, data }">
        <span>{{ data.label }}</span>
        <el-tree :data="data.children" :props="treeProps" node-key="id">
          <template v-slot="{ node, data }">
            <span>{{ data.label }}</span>
          </template>
        </el-tree>
      </template>
    </el-tree>
  </div>
</template>

<script>
export default {
  data() {
    return {
      treeData: [
        {
          id: 1,
          label: 'Node 1',
          children: [
            {
              id: 11,
              label: 'Node 1-1',
              children: [
                {
                  id: 111,
                  label: 'Node 1-1-1',
                },
                {
                  id: 112,
                  label: 'Node 1-1-2',
                },
              ],
            },
            {
              id: 12,
              label: 'Node 1-2',
            },
          ],
        },
        {
          id: 2,
          label: 'Node 2',
        },
      ],
      treeProps: {
        children: 'children',
        label: 'label',
      },
    };
  },
};
</script>

在上述示例中，我们使用了两个el-tree组件。外层的el-tree组件用于展示第一级节点，内层的el-tree组件用于展示子节点。通过递归的方式，我们可以实现多级的树形结构。