json数据生成树形结构的数据

工作中常常遇到将后端传过来的数据处理成树形结构的数据,特此记录一下,如有不对的地方,欢迎指出.

情景描述:后端传过来的数据格式:

categoryList:[{
    name:'水果',
    parentId:'0',
    id:'10',
    isLeafe:'0'
    },{
    name:'甜品',
    parentId:'0',
    id:'20',
    isLeafe:'0'
    },{
    name:'文具',
    parentId:'0',
    id:'30',
    isLeafe:'0'
    },{
    name:'香蕉',
    parentId:'10',
    id:'1010',
    isLeafe:'1'
    },{
    name:'菠萝',
    parentId:'10',
    id:'1020',
    isLeafe:'1'
    },
]

希望处理之后的格式为:

categoryList:[{
    name:'水果',
    parentId:'0',
    id:'10',
    isLeafe:'0',
    children:[{
        name:'香蕉',
        parentId:'10',
        id:'1010',
        isLeafe:'1'
        },{
        name:'菠萝',
        parentId:'10',
        id:'1020',
        isLeafe:'1'
        }]
    },{
    name:'甜品',
    parentId:'0',
    id:'20',
    isLeafe:'0'
    },{
    name:'文具',
    parentId:'0',
    id:'30',
    isLeafe:'0'
    },
]

相应的代码实现:

//可以生成多级嵌套的树
let categoryTree = []; 
let list = categoryList.reduce(function(prev, item){
                prev[item.parentId]?prev[item.parentId].push(item):prev[item.parentId] = [item];
                return prev
            },{});

            
for (let key in list) {
    list[key].forEach(function (item) {
    item.children = list[item.id] ? list[item.id] : [];
    });
}

categoryTree = list[0];

 

  • 2
    点赞
  • 15
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值