问答

有没有性能比较好的方法,把这对象变成树形结构

作者:admin 2021-04-20 我要评论

export const permission = { "Home": "首页", "Home/Music": "音乐", "Home/Video": "视频", "Home/Picture": "图片", "About": "关于", "About2": "关于2", "H...

在说正事之前,我要推荐一个福利:你还在原价购买阿里云、腾讯云、华为云服务器吗?那太亏啦!来这里,新购、升级、续费都打折,能够为您省60%的钱呢!2核4G企业级云服务器低至69元/年,点击进去看看吧>>>)

image.png

export const permission = {
  "Home": "首页",
  "Home/Music": "音乐",
  "Home/Video": "视频",
  "Home/Picture": "图片",
  "About": "关于",
  "About2": "关于2",
  "Home/Setting": "设置",
  "About/Contact": "联系我们",
  "Home/Setting/System": "系统设置",
  "Home/Setting/User": "用户设置",
};

转成

{
    name:"Home",
    path:"/Home",
    title:"首页",
    children:[
        {
         name:"Music",
            path:"/Home/Music",
            title:"音乐",
        }
    ]
}
###

一共 N * 3 次

 const permission = {
    "Home": "首页",
    "Home/Music": "音乐",
    "Home/Video": "视频",
    "Home/Picture": "图片",
    "About": "关于",
    "About2": "关于2",
    "Home/Setting": "设置",
    "About/Contact": "联系我们",
    "Home/Setting/System": "系统设置",
    "Home/Setting/User": "用户设置",
  };

  const list = Object.keys(permission).map(key => {
    const pathArr = key.split('/')
    const pName = pathArr[pathArr.length - 2]
    const name = pathArr[pathArr.length - 1]

    return {
      pName,
      name,
      title: permission[key],
      path: key,
    }
  })

  let map = list.reduce((acc, current) => {
    let key = 'name'
    let _key = `key_${[current[key]]}`
    acc[_key] = current
    return acc
  }, {})

  let result = []
  list.forEach((item) => {
    let _key = `key_${item.pName}`
    let parent = map[_key]

    if (!parent) {
      result.push(item)
    } else {
      parent.children = parent.children || []
      parent.children.push(item)
    }
  })

  console.log('result: ', result);
###

正好回答了个类似的,大概是这个意思,自己再根据情况完善下就行了

function transData(data){
    let obj = {}
    for(let key in data){
        let title = data[key]
        let list = key.split('/')
        list.reduce((parent, citem) => {
            return (parent[citem] = parent[citem] || {})
        }, obj)
    }
    return loop(obj, '/', data)
}
function loop(obj, path, data){
    return Object.keys(obj).map(key => {
        let p = path + key, cc = loop(obj[key], p + '/', data)
        return {
            name: key,
            title: data[p.slice(1)],
            path: p,
            children: cc.length ? cc : undefined
        }
    })
}

transData({
    Home: "首页",
    "Home/Music": "音乐",
    "Home/Video": "视频",
    "Home/Picture": "图片",
    About: "关于",
    About2: "关于2",
    "Home/Setting": "设置",
    "About/Contact": "联系我们",
    "Home/Setting/System": "系统设置",
    "Home/Setting/User": "用户设置"
})

版权声明:本文转载自网络,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。本站转载出于传播更多优秀技术知识之目的,如有侵权请联系QQ/微信:153890879删除

相关文章
  • nginx响应速度很慢

    nginx响应速度很慢

  • 点击选中的多选框,会在已选那一栏显示

    点击选中的多选框,会在已选那一栏显示

  • PHP 多态的理解

    PHP 多态的理解

  • 关于C语言中static的问题

    关于C语言中static的问题

腾讯云代理商
海外云服务器