iview树结构——循环嵌套数组向上查找父级

需求：iview中树结构，点击某一个节点获得它上面的父节点
举例：如下图

点击树结构上的节点 parent 2-2 ，向上查找，找到它的父级节点 parent 2

树节点数据结构：

实现思路：1、拆分嵌套数组为一个个小单元（注意：此树的数据中，每个节点都含有两个属性 objectId 和 parentId ，根据每个节点的 parentId 向上去查找它的父级节点
2、循环拆分好的数组，进行递归查找

完整代码如下：

<template>
	<div class="tree-box">
		<h4>树结构——循环嵌套数组向上查找父级</h4>
		<Tree :data="testData" @on-select-change="treeSelect"></Tree>
	</div>	
</template>

<script>
	import Vue from 'vue'
	export default {
		data(){
			return {
        dataList:[],
        testData:[  //树的数据
            {
                id:1,
                objectId: "1",
                parentId: "0",
                name:'parent 1',
                title:'parent 1',
                age:20,
                expand:true,
                children:[
                    {
                        id:11,
                        objectId: "11",
                        parentId: "1",
                        name:'parent 1-1',
                        title:'parent 1-1',
                        age:'20',
                        children:[]
                    }
                ]
            },
            {
                id:2,
                objectId: "2",
                parentId: "0",
                name:'parent 2',
                title:'parent 2',
                age:30,
                expand:true,
                children:[
                    {
                        id:21,
                        objectId: "21",
                        parentId: "2",
                        name:'parent 2-1',
                        title:'parent 2-1',
                        age:'20',
                        children:[]
                    },
                    {
                        id:22,
                        objectId: "22",
                        parentId: "2",
                        name:'parent 2-2',
                        title:'parent 2-2',
                        age:'21',
                        expand:true,
                        children:[
                            {
                                id:221,
                                objectId: "221",
                                parentId: "22",
                                name:'parent 2-2-1',
                                title:'parent 2-2-1',
                                age:'13',
                                children:[]
                            }
                        ]
                    }
                ]
            },
        ]
			}
    },
    created(){
      this.testForEach()
    },
	methods:{
			//循环嵌套数组拆分
      testForEach(){
          this.testData.forEach(item =>{
              this.dataList.push(item)
              if(item.children.length>0){
                  this.getChem(item.children)
              }
          })
      },
      getChem(data){
          let item = data
          const arr = []
          item.forEach(val =>{
              this.dataList.push(val)
              if (val.children.length > 0) {
                  this.getChem(val.children)
              }
          })
      },
      //点击树节点触发事件
      treeSelect(item){
        console.log('item',item)
        let data = item[0]
        this.getParent(data.parentId)
      },
      //循环嵌套数组向上查找其父级
      getParent(id){
        this.dataList.forEach(item =>{
          if(item.objectId === id){
            console.log('parentObj',item)
          }
        })
      }
	}
 }
</script>

<style scoped>
	.tree-box{
    padding:50px 0;
  }
</style>

运行后，结果如下图：