elementUI Tree 树形控件的官方使用文档树形控件的官方使用文档
Tree 树形控件—官方文档地址
用清晰的层级结构展示信息，可展开或折叠。
基础用法基础用法
基础的树形结构展示。
<el-tree :data="data" :props="defaultProps" @node-click="handleNodeClick"></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'
}] }] }, {
label: '一级 3',
children: [{
label: '二级 3-1',
children: [{
label: '三级 3-1-1'
}] }, {
label: '二级 3-2',
children: [{
label: '三级 3-2-1'
}] }] }],
defaultProps: {
children: 'children',
label: 'label'
}
};
},
methods: {
handleNodeClick(data) {
console.log(data);
}
}
};
</script>
可选择可选择
适用于需要选择层级时使用。本例还展示了动态加载节点数据的方法。
剩余13页未读，继续阅读
资源评论
weixin_38700790
- 粉丝: 5
- 资源: 953
