JS树结构生成与获取到根节点的路径

先来描述一下大致需求
使用el-table下钻功能，但是下钻顺序由用户自定义
目前数据量很大，后端不会一次性返回，需要用户每点击一次下钻，就再次请求。
所以只有前端知道这个下钻顺序，并且上下级之前是隶属关系（比如1级部门2级部门）
RD需求知道从当前节点到根节点的下钻路径是啥,才能查询到准确的数据，这个下钻是前端控制的哦（维度+维度id）维度是前端用户选的顺序，维度id是后端给的列表

image.png

1、问题1

我们仅仅知道用户点击的那一条数据，所以这条数据必须是唯一的才能构建一颗唯一的树结构，如果后端给不到你唯一的值，一定要让他给你生成一个唯一值id

2、构建树

我采用的string切割插入值
table初始化进来只有一层，并且是固定的

const key = `advertiser-${item.id}` // advertiser是维度，后面的参数是id
this.parent_dimension[key] = {}

此时生成的是

{  
  advertiser-10: {}
}

3、用户点击下钻按钮>，再次请求数据

const tempArr = JSON.stringify(this.parent_dimension).replace(/\\/g, '').split(parentKey)
const rear = tempArr[1]
tempArr[1] = insert.join(',') + rear
this.query.parent_dimension = tempArr.join(parentKey)
this.query.parent_dimension = this.query.parent_dimension.replace(/\\/g, '') // 有反斜杠导致无法判断位置

以上操作即可生成树结构

4、计算当前parentKey到root的路径

   // 递归查找到跟节点的路径
  findRoot (obj, v) {
      for (const key in obj) {
        if (key === v) return key
        if (typeof (obj[key]) === 'object') {
          const temp = this.findRoot(obj[key], v)
          if (temp) return key + '&' + temp
        }
      }
    },