react ts常見(jiàn)級(jí)聯(lián)渲染回填不在列表中的數(shù)據(jù)-合并兩個(gè)樹(shù)

前提是讓后端給返回一個(gè)當(dāng)前選擇的樹(shù)
例:

//已選擇的樹(shù)deptsTree你雌,

const deptsTree: any = 
      {
        id: 1,
        parentId: 0,
        children: [
          {
            id: 94,
            parentId: 1,
            children: [
              {
                id: 95,
                parentId: 94,
                children: [],
                sort: 1,
                parentDeptId: 94,
                deptName: '門(mén)-葉子',
                level: 3,
                status: 'DISABLE',
                remark: 'ee'
              }
            ]
          }
        ]
      }
    //獲取到的列表
    const depList: any= [
      {
        id: 1,
        parentId: 0,
        children: [
          {
            id: 46,
            parentId: 1,
            children: [
              {
                id: 47,
                parentId: 46,
                children: [],
                sort: 3,
                parentDeptId: 46,
                deptName: '板燒雞腿堡',
                level: 3,
                status: 'ENABLE',
                remark: null
              }
            ],
            sort: 2,
            parentDeptId: 1,
            deptName: '漢堡包',
            level: 2,
            status: 'ENABLE',
            remark: null
          },
          {
            id: 48,
            parentId: 1,
            children: [],
            sort: 2,
            parentDeptId: 1,
            deptName: '披薩',
            level: 2,
            status: 'ENABLE',
            remark: null
          }
        ],
        sort: 1,
        parentDeptId: 0,
        deptName: '大樹(shù)的根根1',
        level: 1,
        status: 'ENABLE',
        remark: null
      },
      {
        id: 57,
        parentId: 56,
        children: [],
        sort: 11,
        parentDeptId: 56,
        deptName: '二級(jí)部門(mén)',
        level: 2,
        status: 'ENABLE',
        remark: '11'
      },
      {
        id: 101,
        parentId: 0,
        children: [],
        sort: 99,
        parentDeptId: 0,
        deptName: '稱(chēng)',
        level: 1,
        status: 'ENABLE',
        remark: ''
      },
      {
        id: 70,
        parentId: 69,
        children: [],
        sort: 2343,
        parentDeptId: 69,
        deptName: '測(cè)的部',
        level: 3,
        status: 'ENABLE',
        remark: ''
      }
    ]
interface TreeNode {
  id: number
  parentId: number
  children: TreeNode[]
  sort?: number
  parentDeptId?: number
  deptName?: string
  level?: number
  status?: string
  remark?: string
}
//合并方法
export function mergeTrees(deptsTree: TreeNode[], mm: TreeNode): TreeNode[] {
  // 合并節(jié)點(diǎn)
  function mergeNodes(nodes: TreeNode[], item: TreeNode) {
    for (const node of nodes) {
      const outIds = nodes.map((el: any) => el.id)
      if (outIds.indexOf(item.id) == -1) {
        nodes.push(item)
        return
      }
      if (node.id == item.id) {
        const childrenIds = node.children.map((el: any) => el.id)
        if (item.children.length > 0 && childrenIds.indexOf(item.children[0].id) == -1) {
          const childItem: any = item.children[0]
          node.children.push(childItem)
          return
        } else {
          if (node.children && node.children.length > 0 && item.children && item.children.length > 0) {
            mergeNodes(node.children, item.children[0])
            break
          }
        }
      }
    }
  }

  mergeNodes(deptsTree, mm)

  return deptsTree
}
let newTree = mergeTrees(res1, deptTree)
console.log()
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末局荚,一起剝皮案震驚了整個(gè)濱河市,隨后出現(xiàn)的幾起案子侨糟,更是在濱河造成了極大的恐慌,老刑警劉巖瘩燥,帶你破解...
    沈念sama閱讀 211,743評(píng)論 6 492
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件秕重,死亡現(xiàn)場(chǎng)離奇詭異,居然都是意外死亡厉膀,警方通過(guò)查閱死者的電腦和手機(jī)溶耘,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 90,296評(píng)論 3 385
  • 文/潘曉璐 我一進(jìn)店門(mén),熙熙樓的掌柜王于貴愁眉苦臉地迎上來(lái)服鹅,“玉大人凳兵,你說(shuō)我怎么就攤上這事∑笕恚” “怎么了庐扫?”我有些...
    開(kāi)封第一講書(shū)人閱讀 157,285評(píng)論 0 348
  • 文/不壞的土叔 我叫張陵,是天一觀的道長(zhǎng)。 經(jīng)常有香客問(wèn)我形庭,道長(zhǎng)铅辞,這世上最難降的妖魔是什么? 我笑而不...
    開(kāi)封第一講書(shū)人閱讀 56,485評(píng)論 1 283
  • 正文 為了忘掉前任萨醒,我火速辦了婚禮斟珊,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘富纸。我一直安慰自己倍宾,他們只是感情好,可當(dāng)我...
    茶點(diǎn)故事閱讀 65,581評(píng)論 6 386
  • 文/花漫 我一把揭開(kāi)白布胜嗓。 她就那樣靜靜地躺著高职,像睡著了一般。 火紅的嫁衣襯著肌膚如雪辞州。 梳的紋絲不亂的頭發(fā)上怔锌,一...
    開(kāi)封第一講書(shū)人閱讀 49,821評(píng)論 1 290
  • 那天,我揣著相機(jī)與錄音变过,去河邊找鬼埃元。 笑死,一個(gè)胖子當(dāng)著我的面吹牛媚狰,可吹牛的內(nèi)容都是我干的岛杀。 我是一名探鬼主播,決...
    沈念sama閱讀 38,960評(píng)論 3 408
  • 文/蒼蘭香墨 我猛地睜開(kāi)眼崭孤,長(zhǎng)吁一口氣:“原來(lái)是場(chǎng)噩夢(mèng)啊……” “哼类嗤!你這毒婦竟也來(lái)了?” 一聲冷哼從身側(cè)響起辨宠,我...
    開(kāi)封第一講書(shū)人閱讀 37,719評(píng)論 0 266
  • 序言:老撾萬(wàn)榮一對(duì)情侶失蹤遗锣,失蹤者是張志新(化名)和其女友劉穎,沒(méi)想到半個(gè)月后嗤形,有當(dāng)?shù)厝嗽跇?shù)林里發(fā)現(xiàn)了一具尸體精偿,經(jīng)...
    沈念sama閱讀 44,186評(píng)論 1 303
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 36,516評(píng)論 2 327
  • 正文 我和宋清朗相戀三年赋兵,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了笔咽。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點(diǎn)故事閱讀 38,650評(píng)論 1 340
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡霹期,死狀恐怖叶组,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情经伙,我是刑警寧澤扶叉,帶...
    沈念sama閱讀 34,329評(píng)論 4 330
  • 正文 年R本政府宣布勿锅,位于F島的核電站,受9級(jí)特大地震影響枣氧,放射性物質(zhì)發(fā)生泄漏溢十。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 39,936評(píng)論 3 313
  • 文/蒙蒙 一达吞、第九天 我趴在偏房一處隱蔽的房頂上張望张弛。 院中可真熱鬧,春花似錦酪劫、人聲如沸吞鸭。這莊子的主人今日做“春日...
    開(kāi)封第一講書(shū)人閱讀 30,757評(píng)論 0 21
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽(yáng)刻剥。三九已至,卻和暖如春滩字,著一層夾襖步出監(jiān)牢的瞬間造虏,已是汗流浹背。 一陣腳步聲響...
    開(kāi)封第一講書(shū)人閱讀 31,991評(píng)論 1 266
  • 我被黑心中介騙來(lái)泰國(guó)打工麦箍, 沒(méi)想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留漓藕,地道東北人。 一個(gè)月前我還...
    沈念sama閱讀 46,370評(píng)論 2 360
  • 正文 我出身青樓挟裂,卻偏偏與公主長(zhǎng)得像享钞,于是被迫代替她去往敵國(guó)和親。 傳聞我的和親對(duì)象是個(gè)殘疾皇子诀蓉,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 43,527評(píng)論 2 349

推薦閱讀更多精彩內(nèi)容