el-tree的用法
时间: 2023-11-11 17:02:57 浏览: 55
element-ui 中的 el-tree 是一种常见的树形控件,用于展示层级结构数据,常见的使用场景如组织结构图、文件夹结构等。它的基本用法如下:
1. 引入 el-tree 组件:
```
import {ElTree} from 'element-ui';
```
2. 在模板中使用 el-tree 组件,并绑定数据:
```
<el-tree :data="treeData"></el-tree>
```
其中,treeData 是一个数组,数组中每个元素表示一条树形结构数据。
3. 在组件中定义 treeData 数据:
```
data() {
return {
treeData: [
{
label: '一级 1',
children: [
{
label: '二级 1-1',
children: [{
label: '三级 1-1-1'
}]
}
]
},
{
label: '一级 2',
children: [
{
label: '二级 2-1'
},
{
label: '二级 2-2'
}
]
}
]
};
}
```
以上的代码就可以渲染出一个简单的树形结构。