先來(lái)描述一下大致需求
使用el-table下鉆功能，但是下鉆順序由用戶自定義
目前數(shù)據(jù)量很大，后端不會(huì)一次性返回，需要用戶每點(diǎn)擊一次下鉆，就再次請(qǐng)求。
所以只有前端知道這個(gè)下鉆順序，并且上下級(jí)之前是隸屬關(guān)系（比如1級(jí)部門2級(jí)部門）
RD需求知道從當(dāng)前節(jié)點(diǎn)到根節(jié)點(diǎn)的下鉆路徑是啥,才能查詢到準(zhǔn)確的數(shù)據(jù)，這個(gè)下鉆是前端控制的哦（維度+維度id）維度是前端用戶選的順序，維度id是后端給的列表

image.png

1、問(wèn)題1

我們僅僅知道用戶點(diǎn)擊的那一條數(shù)據(jù)，所以這條數(shù)據(jù)必須是唯一的才能構(gòu)建一顆唯一的樹結(jié)構(gòu)，如果后端給不到你唯一的值，一定要讓他給你生成一個(gè)唯一值id

2、構(gòu)建樹

我采用的string切割插入值
table初始化進(jìn)來(lái)只有一層，并且是固定的

const key = `advertiser-${item.id}` // advertiser是維度，后面的參數(shù)是id
this.parent_dimension[key] = {}

此時(shí)生成的是

{  
  advertiser-10: {}
}

3、用戶點(diǎn)擊下鉆按鈕>，再次請(qǐng)求數(shù)據(jù)

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, '') // 有反斜杠導(dǎo)致無(wú)法判斷位置

以上操作即可生成樹結(jié)構(gòu)

4、計(jì)算當(dāng)前parentKey到root的路徑

   // 遞歸查找到跟節(jié)點(diǎn)的路徑
  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
        }
      }
    },