zoukankan      html  css  js  c++  java
  • JS当中的无限分类递归树

    列表转换成树形结构方法定义:

    //javascript  树形结构
    function toTree(data) {
        // 删除 所有 children,以防止多次调用
        data.forEach(function(item) {
            delete item.children;
        });
    
        // 将数据存储为 以 id 为 KEY 的 map 索引数据列
        var map = {};
        data.forEach(function(item) {
            // 在该方法中可以给每个元素增加其他属性
            item.text = item.name;
            map[item.id] = item;
        });
        //  console.log(map);
    
        var val = [];
        data.forEach(function(item) {
    
            // 以当前遍历项,的pid,去map对象中找到索引的id
            var parent = map[item.pid];
    
            // 好绕啊,如果找到索引,那么说明此项不在顶级当中,那么需要把此项添加到,他对应的父级中
            if (parent) {
                // 可以给每个父节点添加属性
                parent.iconCls = "i-folder";
                //  添加到父节点的子节点属性中
                (parent.children || (parent.children = [])).push(item);
    
            } else {
                //如果没有在map中找到对应的索引ID,那么直接把 当前的item添加到 val结果集中,作为顶级
                val.push(item);
            }
        });
        return val;
    }

    树形结构数据:

    var data = [
            {
                id:1,
                name :"一级分类:1",
                pid :0,
            },
            {
                id:2,
                name :"二级分类:1",
                pid :1,
            },
            {
                id:3,
                name :"三级分类:3",
                pid :2,
            },
            {
                id:4,
                name :"一级分类:2",
                pid :0,
            },
            {
                id:7,
                name :"f级分类:2",
                pid :4,
            },
            {
                id:10,
                name :"f级分类:2",
                pid :7,
            },
            {
                id:9,
                name :"f级分类:2",
                pid :10,
            },
            {
                id:12,
                name :"f级分类:2",
                pid :9,
            },
            {
                id:15,
                name :"f级分类:2",
                pid :12,
            },
            {
                id:13,
                name :"f级分类:2",
                pid :15,
            },
        ]

    版权声明:本文为CSDN博主「花村大地主」的原创文章,转载请附上原文出处链接及本声明。
    原文链接:https://blog.csdn.net/jayhkw/article/details/68945087

  • 相关阅读:
    过滤器(Filter)
    DBUtils结果集处理器介绍
    Tomcat配置连接c3p0连接池
    JdbcUtils
    数据库连接池
    JDBC处理事务
    JDBC入门(5)--- 时间类型、大数据
    JDBC入门(4)--- 批处理
    JDBC入门(3)--- PrepareStatement
    JDBC入门(2)--- ResultSet之滚动结果集
  • 原文地址:https://www.cnblogs.com/silfox/p/11411680.html
Copyright © 2011-2022 走看看