1、定义想要处理的tree数组
//在vue的data中定义一个数组,这个数组我写的是死数据,所以写的不规范,最终结果是正确的
tableData: [{
id: 3,
date: '2016-05-011',
name: '王小虎1',
type:1,
address: '11',
children: [{
id: 31,
date: '2016-05-012',
name: '王小虎2',
type:1,
address: '22',
children: [{
id: 311,
date: 'kafka',
type:1,
name: '王小虎3',
address: '33',
children: [{
id: 3111,
date: '2016-05-01',
name: '王小虎4',
address: '44',
type:2,
}, {
id: 3211,
date: '2016-05-01',
name: '王小虎5',
type:2,
address: '55'
}]
}]
}]
}],
2、定义函数
//获取树形数据的某个元素的所有父节点
//在methods中写如下函数
getTreePath(tree, func, path){
if (!tree) return []
for (const data of tree) {
// 这里按照你的需求来存放最后返回的内容吧
//这里的date是表示我是根据date去查询父级的,你可以修改成你的需求,其他不变
path.push(data.date)
if (func(data)) return path
if (data.children) {
const findChildren = this.getTreePath(data.children, func, path)
if (findChildren.length) return findChildren
}
path.pop()
}
return []
},
3、调用函数
//在mounted调用函数,调用的时候第二个参数(data=> data.date==='kafka')只需要修改里面的date也就是查询的参数名,和后面的目标节点值
mounted(){
this.getTreePath(this.tableData, data=> data.date==='kafka',this.path)
},
4、打印看结果
获得所要查询的kafka的两个父级包含本身
版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。
文章由极客之音整理,本文链接:https://www.bmabk.com/index.php/post/149798.html