一、前提
官网上有两种办法:
根据 data 或者 key 拿到 Tree 组件中的 node (data) 要获得 node 的 key 或者 data。
我这key设置后没有生效,采用的node获取的方法
1、html部分
<el-tree
ref="tree"
:data="treeData"
node-key="id"
:props="defaultProps"
@node-click="handleNodeClick"
>
</el-tree>
2、data举例
data(){
return {
treeData:[{
id:'11',
label: '一级 1'
}, {
id:'22',
label: '一级 2',
children: [{
id:'221',
label: '二级 2-1',
}]
}]
}
}
二、实现
handleNodeClick(node){
console.log(node)//node为点击节点绑定的**数据**
let pNode = this.$refs.tree.getNode(node).parent.data;
console.log(pNode)//获得点击节点父节点的**数据**
}
el-tree提供的回调事件:@node-click=“handleNodeClick”。(方法名自取,这里用的原来的“handleNodeClick”)
其他:①通过打印getNode结果,发现当前点击节点的值不是直接显示在结构中,而是用data
又包裹了一层,data
内部才是当前点击节点的具体数据。
②打印出的getNode结果,里面有一个parent
属性,同样parent
内的data
才是父节点的数据
③对于一层结构中的id值,和我绑的node-key
对应不上,只有如上述两个data
中的id才是我正确需要的文章来源:https://www.toymoban.com/news/detail-504872.html
附:getNode调用后打印的结构示例:
文章来源地址https://www.toymoban.com/news/detail-504872.html
到了这里,关于el-tree使用获取当前选中节点的父节点数据(开发记录)的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!