elementPlus tree树形控件的手风琴模式怎么禁止获取父节点的数据
时间: 2024-03-11 15:48:45 浏览: 90
vue elementUI tree树形控件获取父节点ID的实例
要禁止获取父节点的数据,需要在 ElementPlus tree 树形控件的配置中设置`lazy`属性为`true`,同时在获取子节点数据时,需要返回一个空数组。具体代码如下:
```html
<template>
<el-tree
:data="treeData"
:props="defaultProps"
:lazy="true"
:load="loadNode"
accordion
></el-tree>
</template>
<script>
export default {
data() {
return {
treeData: [],
defaultProps: {
children: 'children',
label: 'label'
}
}
},
methods: {
loadNode(node, resolve) {
// 如果是根节点,则加载全部数据
if (node.level === 0) {
this.treeData = [
{ label: 'Node 1', children: [{ label: 'Child 1' }, { label: 'Child 2' }] },
{ label: 'Node 2', children: [{ label: 'Child 3' }, { label: 'Child 4' }] }
]
resolve(this.treeData)
} else {
// 如果是非根节点,则返回一个空数组
resolve([])
}
}
}
}
</script>
```
在上述代码中,我们通过设置`lazy`属性为`true`,表示开启懒加载模式。在`loadNode`方法中,如果是根节点,则加载全部数据;如果是非根节点,则返回一个空数组,表示不加载子节点数据。这样就可以禁止获取父节点的数据了。同时,我们还设置了`accordion`属性,表示开启手风琴模式。
阅读全文