zoukankan      html  css  js  c++  java
  • tree的递归,适合与el-tree

    // 原始数据
    var data = [
    { id: 1, name: "办公管理", pid: 0 },
    { id: 2, name: "请假申请", pid: 1 },
    { id: 3, name: "出差申请", pid: 1 },
    { id: 4, name: "请假记录", pid: 2 },
    { id: 5, name: "系统设置", pid: 0 },
    { id: 6, name: "权限管理", pid: 5 },
    { id: 7, name: "用户角色", pid: 6 },
    { id: 8, name: "菜单设置", pid: 6 },
    ];
    // 要生成的数据
    var data = [
    	{id: 1, name: "办公管理", pid: 0 ,
    		children:[
    			{ id: 2, name: "请假申请", pid: 1,
    				hildren:[
    					{ id: 4, name: "请假记录", pid: 2 },
    				],
    			},
    			{ id: 3, name: "出差申请", pid: 1},
    		]
        },
    	{id: 5, name: "系统设置", pid: 0 ,
    		children:[
    			{ id: 6, name: "权限管理", pid: 5,
    				hildren:[
    					{ id: 7, name: "用户角色", pid: 6 },
    					{ id: 8, name: "菜单设置", pid: 6 },
    				]
    			},
    		]
    	},
    ];
    
    // 方法
    function toTree(data) {
            // 删除 所有 children,以防止多次调用
            data.forEach(function (item) {
                delete item.children;
            });
     
            // 将数据存储为 以 id 为 KEY 的 map 索引数据列
            var map = {};
            data.forEach(function (item) {
                map[item.id] = item;
            });
    
            var val = [];
            data.forEach(function (item) {
                // 以当前遍历项,的pid,去map对象中找到索引的id
                var parent = map[item.pid];
                // 好绕啊,如果找到索引,那么说明此项不在顶级当中,那么需要把此项添加到,他对应的父级中
                if (parent) {
                    (parent.children || ( parent.children = [] )).push(item);
                } else {
                    //如果没有在map中找到对应的索引ID,那么直接把 当前的item添加到 val结果集中,作为顶级
                    val.push(item);
                }
            });
            return val;
        }
        
    

      

  • 相关阅读:
    JS正则手机靓号处理AB ABAB AABB
    url参数中有+、空格、=、%、&、#等特殊符号的问题解决
    LigerUI 使用教程表格篇
    JS获取地址栏参数
    手机端meta
    最大连续子序列 hdu 1231
    I NEED A OFFER! hdu1203(背包)
    Bookshelf 2 poj3628(01背包/DFS)
    Charm Bracelet poj3624(01背包)
    985的方格难题(dp)
  • 原文地址:https://www.cnblogs.com/wfc139/p/14083867.html
Copyright © 2011-2022 走看看