javascript - 平铺的json转树结构的json,请看数据

查看:185
本文介绍了javascript - 平铺的json转树结构的json,请看数据的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

问 题

{
    "name": "paragraph",
    "fullName": "paragraph",
    "description": "",
    "varType": "paragraph",
    "type": 4,
    "sampleIndex": 0
}, {
    "name": "$intf",
    "fullName": "paragraph.$intf",
    "description": "",
    "varType": "string",
    "type": 2,
    "sampleIndex": 0
}, {
    "name": "$mtu",
    "fullName": "paragraph.$mtu",
    "description": "",
    "varType": "int",
    "type": 1,
    "sampleIndex": 0
}, {
    "name": "$bw",
    "fullName": "paragraph.$bw",
    "description": "",
    "varType": "int",
    "type": 1,
    "sampleIndex": 0
}, {
    "name": "SubParagraph",
    "fullName": "paragraph.SubParagraph",
    "description": "",
    "varType": "paragraph",
    "type": 4,
    "sampleIndex": 0
}, {
    "name": "$subId",
    "fullName": "paragraph.SubParagraph.$subId",
    "description": "",
    "varType": "string",
    "type": 2,
    "sampleIndex": 0
}

利用fullName表示的关系,一个 . 代表一级
如何将上面的数据转换成类似下面的格式:

{
    name: "bgp_rid",
    type: "single",
    draggable: true
}, {
    name: "bgp_nbrs",
    type: "table",
    children: [{
        name: "bgp_rid1",
        type: "single",
        draggable: true
    }, {
        name: "bgp_nbrs1",
        type: "table",
        draggable: true
    }, {
        name: "bgp_nbrs1",
        type: "interface_table",
        children: [{
            name: "bgp_rid1",
            type: "single",
            draggable: true
        }, {
            name: "bgp_nbrs1",
            type: "table",
            draggable: true,
            children: [{
                name: "bgp_rid1",
                type: "single",
                draggable: true
            }, {
                name: "bgp_nbrs1",
                type: "table",
                draggable: true
            }]
        }]
    }]
}

解决方案

这个好像能用

var arr = [{
    'name': 'paragraph',
    'fullName': 'paragraph',
    'description': '',
    'varType': 'paragraph',
    'type': 4,
    'sampleIndex': 0
}, {
    'name': '$intf',
    'fullName': 'paragraph.$intf',
    'description': '',
    'varType': 'string',
    'type': 2,
    'sampleIndex': 0
}, {
    'name': '$mtu',
    'fullName': 'paragraph.$mtu',
    'description': '',
    'varType': 'int',
    'type': 1,
    'sampleIndex': 0
}, {
    'name': '$bw',
    'fullName': 'paragraph.$bw',
    'description': '',
    'varType': 'int',
    'type': 1,
    'sampleIndex': 0
}, {
    'name': 'SubParagraph',
    'fullName': 'paragraph.SubParagraph',
    'description': '',
    'varType': 'paragraph',
    'type': 4,
    'sampleIndex': 0
}, {
    'name': '$subId',
    'fullName': 'paragraph.SubParagraph.$subId',
    'description': '',
    'varType': 'string',
    'type': 2,
    'sampleIndex': 0
}];

var result = arr.reduce(function(previous, item) {
    var levels = item.fullName.split('.');
    if (levels.length === 1) {
        item.children = [];
        previous.push(item);
    } else {
        levels
            .reduce(function(p, level) {
                var found = p.find(it => it.name === level);
                if (!found) {
                    return p;
                }
                if (!found.children) {
                    found.children = [];
                }
                return found.children;
            }, previous)
            .push(item);
    }
    return previous;
}, []);

console.log(result);

这篇关于javascript - 平铺的json转树结构的json,请看数据的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆