从MySQL/JSON数据创建JSON分层树 [英] Create a JSON hierarchical tree from MySQL/JSON data

查看:169
本文介绍了从MySQL/JSON数据创建JSON分层树的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有一个非常大的JSON对象,我需要进入一棵树,但是我不确定该怎么做.我正在将VueJs与内置了Treeview的Vuetify一起使用,但我不知道如何为树准备好数据.

这是我的数据... https://tpcrm.totalprocessing.com/api/获取频道

我需要的是(显然没有包括所有数据)

 items: [
    {
        name: "Adboom",
        id: "8ac9a4cb64b143910164b1b2ab0305db"
        children: [
            {
                name: "Jaydox LTD",
                id: "8ac9a4cb64b143910164b1b3009b05e2"
                children: [
                    {
                        name: "beautifullyyoungskin.net"
                        id: "8ac9a4cb64b143910164b1b8004b063a"
                    },
                    {
                        name: "thinbodydiet.com"
                        id: "8ac9a4cb64b143910164b1b74af10630"
                    },
                    {
                        name: "youthfulskincare.net"
                        id: "8ac9a4cb64b143910164b1b77ba70634"
                    }
                ]
            }
        ]
    },
    {
        name: "Adult",
        id: "8ac9a4c96489324601649354068034ab"
        children: [
            {
                name: "Occonti Ltd",
                id: "8ac9a4c965a8666d0165af279ca228dd"
                children: [
                    {
                        name: "datinginthe.eu (3d Secure)"
                        id: "8ac9a4cd65a866700165b47a25c74e61"
                    },
                    {
                        name: "datinginthe.eu (Non-3d)"
                        id: "8ac9a4cd65a866700165b478f0574e48"
                    },
                    {
                        name: "datinginthe.eu - ST (Non-3d)"
                        id: "8ac9a4ca65a8a0670165d34366d53fc9"
                    },
                    {
                        name: "datinginthe.eu ST (3d Secure)"
                        id: "8ac9a4cb66aafd790166ad040a170b68"
                    }
                ]
            }
        ]
    }
] 

解决方案

通过对nameid使用相同的模式,可以使用一组关键部分并查找ID和按其分组. /p>

 var data = [{ divisionName: "Adboom", divisionId: '000', merchantName: "Jaydox LTD", merchantId: '020', entityName: "beautifullyyoungskin.net", entityId: '500' }, { divisionName: "Adboom", divisionId: '000', merchantName: "Jaydox LTD", merchantId: '020', entityName: "thinbodydiet.com", entityId: '501' }, { divisionName: "Adboom", divisionId: '000', merchantName: "Jaydox LTD", merchantId: '020', entityName: "youthfulskincare.net", entityId: '502' }, { divisionName: "Adult", divisionId: '100', merchantName: "Occonti Ltd", merchantId: '040', entityName: "datinginthe.eu (3d Secure)", entityId: '503' }, { divisionName: "Adult", divisionId: '100', merchantName: "Occonti Ltd", merchantId: '040', entityName: "datinginthe.eu (Non-3d)", entityId: '504' }, { divisionName: "Adult", divisionId: '100', merchantName: "Occonti Ltd", merchantId: '040', entityName: "datinginthe.eu - ST (Non-3d)", entityId: '505' }, { divisionName: "Adult", divisionId: '100', merchantName: "Occonti Ltd", merchantId: '040', entityName: "datinginthe.eu ST (3d Secure)", entityId: '506' }],
    keys = ["division", "merchant", "entity"],
    result = data
        .reduce((r, o) => {
            keys.reduce((t, k) => {
                var temp = (t.children = t.children || []).find(p => p.id === o[k + 'Id']);
                if (!temp) {
                    t.children.push(temp = { name: o[k + 'Name'], id: o[k + 'Id'] });
                }
                return temp;
            }, r);
            return r;
        }, {})
        .children;

console.log(result); 

 .as-console-wrapper { max-height: 100% !important; top: 0; } 

I have a very large JSON object that I need to get into a tree but I'm unsure on how to do it. I'm using VueJs with Vuetify which has Treeview built in but I don't know how to actually get my data ready for the tree.

This is my data... https://tpcrm.totalprocessing.com/api/get-channels

And what I need is this (obviously haven't included all the data)

items: [
    {
        name: "Adboom",
        id: "8ac9a4cb64b143910164b1b2ab0305db"
        children: [
            {
                name: "Jaydox LTD",
                id: "8ac9a4cb64b143910164b1b3009b05e2"
                children: [
                    {
                        name: "beautifullyyoungskin.net"
                        id: "8ac9a4cb64b143910164b1b8004b063a"
                    },
                    {
                        name: "thinbodydiet.com"
                        id: "8ac9a4cb64b143910164b1b74af10630"
                    },
                    {
                        name: "youthfulskincare.net"
                        id: "8ac9a4cb64b143910164b1b77ba70634"
                    }
                ]
            }
        ]
    },
    {
        name: "Adult",
        id: "8ac9a4c96489324601649354068034ab"
        children: [
            {
                name: "Occonti Ltd",
                id: "8ac9a4c965a8666d0165af279ca228dd"
                children: [
                    {
                        name: "datinginthe.eu (3d Secure)"
                        id: "8ac9a4cd65a866700165b47a25c74e61"
                    },
                    {
                        name: "datinginthe.eu (Non-3d)"
                        id: "8ac9a4cd65a866700165b478f0574e48"
                    },
                    {
                        name: "datinginthe.eu - ST (Non-3d)"
                        id: "8ac9a4ca65a8a0670165d34366d53fc9"
                    },
                    {
                        name: "datinginthe.eu ST (3d Secure)"
                        id: "8ac9a4cb66aafd790166ad040a170b68"
                    }
                ]
            }
        ]
    }
]

解决方案

By using the same pattern for name and id, you could use an array of key parts and look for the id and group by it.

var data = [{ divisionName: "Adboom", divisionId: '000', merchantName: "Jaydox LTD", merchantId: '020', entityName: "beautifullyyoungskin.net", entityId: '500' }, { divisionName: "Adboom", divisionId: '000', merchantName: "Jaydox LTD", merchantId: '020', entityName: "thinbodydiet.com", entityId: '501' }, { divisionName: "Adboom", divisionId: '000', merchantName: "Jaydox LTD", merchantId: '020', entityName: "youthfulskincare.net", entityId: '502' }, { divisionName: "Adult", divisionId: '100', merchantName: "Occonti Ltd", merchantId: '040', entityName: "datinginthe.eu (3d Secure)", entityId: '503' }, { divisionName: "Adult", divisionId: '100', merchantName: "Occonti Ltd", merchantId: '040', entityName: "datinginthe.eu (Non-3d)", entityId: '504' }, { divisionName: "Adult", divisionId: '100', merchantName: "Occonti Ltd", merchantId: '040', entityName: "datinginthe.eu - ST (Non-3d)", entityId: '505' }, { divisionName: "Adult", divisionId: '100', merchantName: "Occonti Ltd", merchantId: '040', entityName: "datinginthe.eu ST (3d Secure)", entityId: '506' }],
    keys = ["division", "merchant", "entity"],
    result = data
        .reduce((r, o) => {
            keys.reduce((t, k) => {
                var temp = (t.children = t.children || []).find(p => p.id === o[k + 'Id']);
                if (!temp) {
                    t.children.push(temp = { name: o[k + 'Name'], id: o[k + 'Id'] });
                }
                return temp;
            }, r);
            return r;
        }, {})
        .children;

console.log(result);

.as-console-wrapper { max-height: 100% !important; top: 0; }

这篇关于从MySQL/JSON数据创建JSON分层树的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

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