el-tree获取选中的所有节点,除了父节点
时间: 2024-08-30 14:02:38 浏览: 77
vue el-tree 默认展开第一个节点的实现代码
在Element UI的el-tree组件中,如果你想要获取选中的所有节点,但排除掉父节点,你可以通过监听tree组件的`@check-change`事件,并在事件处理函数中检查当前被选中的节点是否为其父节点。这里是一个简单的示例:
```javascript
<template>
<el-tree ref="treeRef" :data="treeData" @check-change="handleCheckChange"></el-tree>
</template>
<script>
export default {
data() {
return {
treeData: ... // 填充你的树数据结构
};
},
methods: {
handleCheckChange(data) {
const selectedNodes = this.$refs.treeRef.getCheckedNodes(); // 获取所有选中节点
let filteredNodes = []; // 存储非父节点的选中节点
for (let node of selectedNodes) {
if (!node.parent || !filteredNodes.includes(node.parent)) { // 检查是否为父节点
filteredNodes.push(node);
}
}
console.log(filteredNodes); // 打印非父节点的选中节点
}
}
};
</script>
```
在这个例子中,`handleCheckChange`函数首先获取所有的选中节点,然后遍历它们,如果遇到不是其父节点的,则将其添加到`filteredNodes`数组中。
阅读全文