【ElementPlus】4.Virtualized Tree 虚拟化树形控件

发表于 更新于 分类于 ，

树形控件是类似思维导图一样的组件，并且可以折叠和展开。

实现效果如图：

::: demo-wrapper no-padding 20250226175240 :::

这是Lanqiao给出的代码实例，存在问题，建议查看官方文档；

:collapsed-lines
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
<el-tree :data="data" :props="defaultProps"></el-tree>

<script>
  export default {
    data() {
      return {
        data: [{
          label: '一级 1',
          children: [{
            label: '二级 1-1',
            children: [{
              label: '三级 1-1-1'
            }]
          }]
        }, {
          label: '一级 2',
          children: [{
            label: '二级 2-1',
            children: [{
              label: '三级 2-1-1'
            }]
          }, {
            label: '二级 2-2',
            children: [{
              label: '三级 2-2-1'
            }]
          }]
        },
        }],
        defaultProps: {
          children: 'children',
          label: 'label'
        }
      };
    }
  };
</script>