一维权限数组生成树结构权限

最新推荐文章于 2024-07-19 13:54:51 发布

斗空红鹰

最新推荐文章于 2024-07-19 13:54:51 发布

阅读量889

点赞数

CC 4.0 BY-SA版权

分类专栏： javascript 文章标签：权限树 javascript 前端

本文链接：https://blog.youkuaiyun.com/qq_16515187/article/details/78414281

javascript 专栏收录该内容

7 篇文章

订阅专栏

本文介绍了一种将一维数组转换为树形结构的方法。通过递归函数实现，适用于权限管理等场景中对数据进行层级展示的需求。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

问题描述

将let authList = [
    {
        id:"1",
        parentId:"0"
    },{
        id:"2",
        parentId:"0"
    },{
        id:"21",
        parentId:"2"
    },{
        id:"211",
        parentId:"21"
    }
]
转成
let authTree = {  
        id:"0", 
        children:[  
            {  
                id:"1",  
                parentId:"0", 
                treeId:"0-1" 
                children:[]  
            },{  
                id:"2",  
                parentId:"0",  
                treeId:"0-2"
                children:[  
                    {  
                        id:"21",  
                        parentId:"2",  
                        treeId:"0-2-21"
                        children:[  
                            {  
                                id:"211",  
                                parentId:"21",
                                treeId:"0-2-21-211" 
                            }  
                        ]  
                    }  
                ]  
            }  
        ]  
    }

代码如下:

    /*
    * authList:需要被转换的一维数组
    * authTreeRootNode:权限树根节点
    * idMap:记录树结构的id路径
    */
    function convertToTree(authList,authTreeRootNode,idMap){
        authTreeRootNode.children = [];
        let parntId = authTreeRootNode.id
        for(let i = authList.length-1;i>=0;i--){
            if(authList[i].parentId == parntId){
                idMap[authList[i].id] = idMap[authList[i].parentId]?`${idMap[authList[i].parentId]}-${authList[i].id}` : authList[i].id;
                authList[i].treeId = idMap[authList[i].id];
                authTreeRootNode.children.push(authList[i]);
                convertToTree(authList,authTreeRootNode[authTreeRootNode.children.length-1],idMap);
            }
        }
    }

运行结果:
这里写图片描述