zoukankan      html  css  js  c++  java
  • 数据处理为树形结构以及多级菜单的逻辑分析

    function treeData(data){   
            let cloneData = JSON.parse(JSON.stringify(data))
            return cloneData.filter(father=>{
                let branchArr = cloneData.filter(child => father['id'] == child['pid']);
                branchArr.length>0 ? father['children'] = branchArr : '';
                return father['pid'] == 0 ;
            })
        }
    function toTree(data) {
            let result = []
            if (!Array.isArray(data)) {
                return result
            }
            data.forEach(item => {
                delete item.children;
            });
            let map = {};
            data.forEach(item => {
                item.expand = false;
                map[item.id] = item;
            });
            data.forEach(item => {
                let parent = map[item.pid];
                if (parent) {
                    (parent.children || (parent.children = [])).push(item);
                } else {
                    result.push(item);
                }
            });
            return result;
        }

    //数据源组装成树形结构(一级与后面的级逻辑不同)
    逻辑:开始遍历所有数据,根据一级关系找出一级,调用二级方法;将2级方法抽离出来,在2级方法中遍历所有数据,并根据一级与2级的关系找出2级
    function first(data,arr,0){
    for(var i =0;i<data.length;i++){
    if(data[i].pid == 0){
    arr.push(data[i]);
    two(data,data[i].id);
    }
    }
    }
    function two (data,pid){
    var arr = [];
    for(var i = 0;i<data[i].length;i++){
    if(data[i].pid == pid){
    arr.push(data[i])
    }
    }
    return arr;
    }

  • 相关阅读:
    Object的原型拷贝-create、assign、getPrototypeOf 方法的结合
    配intelliJ IDEA 过程
    浅谈HTTP中Get与Post的区别
    apply、call、bind区别、用法
    引用类型与原始类型的区别
    html5标签集结1
    指针作为参数传递
    指针与指针变量
    函数模板
    内置函数
  • 原文地址:https://www.cnblogs.com/tutao1995/p/9777204.html
Copyright © 2011-2022 走看看