获取子节点的所有祖父节点-ts

tu_zi_dou

已于 2022-11-24 09:56:26 修改

阅读量437

点赞数

文章标签： javascript 前端 vue.js

于 2022-11-21 15:18:46 首次发布

本文链接：https://blog.csdn.net/tu_zi_dou/article/details/127965431

版权

获取子节点的所有祖父节点-ts

/*
* for in (数组、对象)key值遍历
* for of 数组、系统内置的伪数组(arguments等)、字符串、Set 和 Map 结构，不能遍历对象—返回值
* 判断结果只有一句是可以不写花括号
* */
interface IItemObj{
  label: string,
  value: number,
  children?: IItemObj[]
}

type GetNodes = (treeOptions: IItemObj[], treeIds: number[]) => number[][]

let treeOptions: IItemObj[] = [
  {
    label: '我的',
    value: 1,
    children: [
      {
        label: '我的信息',
        value: 2,
        children: [
          {
            label: '我的基础信息',
            value: 3
          },
          {
            label: '我的信息积分信息',
            value: 10,
            children: [
              {
                label: '我的基础信息',
                value: 11,
                children: [
                  {
                    label: '我的基础信息',
                    value: 12
                  },
                ]
              },
            ]
          }
        ]
      },
      {
        label: '我的邀请',
        value: 4
      }
    ]
  },
  {
    label: '首页',
    value: 5,
    children: [
      {
        label: '首页列表',
        value: 6
      },
      {
        label: '首页目录',
        value: 7
      }
    ]
  }
]

/// 获取子节点的所有祖父节点(没有查询到返回[])
let getNodes: GetNodes = (treeOptions, treeIds) => {
  const fn = (children: IItemObj[], id: number): number[] => {
    for(let op of children){
      if(op.value === id) return ([op.value])
      if(op?.children){
        let ids = fn(op.children, id)
        if(ids) return ([op.value, ...ids])
      }
    }
  }
  return treeIds.map(id => fn(treeOptions, id) || [])
}

console.log(getNodes(treeOptions, [11, 5, 3]))