JS组装数据结构

开始的数据结构如下:里面的工程数据是一条条的....

   var reg ={
        data: [
             {
                xmId: "c8bfc7f4-153c-4f85-b6bd-e0b47856ca0f",
                xmName: "新建武汉至十堰高速铁路",
                xmShortName: "汉十高铁",
                projectId: "23a8dcdf-ad9b-4c34-8807-02e6fad2cdf4",
                projectName: "安陆府河特大桥",
                buildTypeCode: "Q",
                jcb: "HSJC-2",
                jlb: "HSJL-1",
                sgb: "HSSG-1",
                total: 4
            },
            {
                xmId: "c8bfc7f4-153c-4f85-b6bd-e0b47856ca0f",
                xmName: "新建武汉至十堰高速铁路",
                xmShortName: "汉十高铁",
                projectId: "ce574f2d-8f55-4f5c-8850-b37d01e123fc",
                projectName: "安陆府河特大桥(DK091+092.615)十堰台(DK094+009.44~DK094+030.46)",
                buildTypeCode: "T",
                jcb: "HSJC-2",
                jlb: "HSJL-1",
                sgb: "HSSG-1",
                total: 3
            },
            {
                xmId: "c6bfc7f4-153c-4f85-b6bd-e0b47856ca0f",
                xmName: "新建武汉至十堰高速铁路",
                xmShortName: "汉十高铁11111",
                projectId: "ce574f2d-8f55-4f5c-8850-b37d01e123fc",
                projectName: "云安特大桥",
                buildTypeCode: "T",
                jcb: "HSJC-2",
                jlb: "HSJL-1",
                sgb: "HSSG-1",
                total: 35
            }
        ],
        code: 0,
        message: "操作成功"
    };

现在要做的是把项目ID相同的工程放在同一项目下--project数组里-数据结构如下:

 var data = [
        {
            xmId: "c8bfc7f4-153c-4f85-b6bd-e0b47856ca0f",
            xmName: "新建武汉至十堰高速铁路",
            xmShortName: "汉十高铁",
            project: [
                {
                projectId: "23a8dcdf-ad9b-4c34-8807-02e6fad2cdf4",
                projectName: "安陆府河特大桥",
                buildTypeCode: "Q",
                jcb: "HSJC-2",
                jlb: "HSJL-1",
                sgb: "HSSG-1",
                total: 4
            },
                {
                    projectId: "ce574f2d-8f55-4f5c-8850-b37d01e123fc",
                    projectName: "安陆府河特大桥(DK091+092.615)十堰台(DK094+009.44~DK094+030.46)",
                    buildTypeCode: "T",
                    jcb: "HSJC-2",
                    jlb: "HSJL-1",
                    sgb: "HSSG-1",
                    total: 3
                }
            ]
        },

        {
            xmId: "a1fd685f-ec44-4d46-8d4d-7b35c0ca08ca",
            xmName: "新建襄阳至武汉高速铁路",
            xmShortName: "襄武高铁",
            project: [{
                projectId: "23b8dcdf-ad9b-4c34-8807-02e6fad2cdf4",
                projectName: "襄武第一段",
                buildTypeCode: "Q",
                jcb: "HSJC-2",
                jlb: "HSJL-1",
                sgb: "HSSG-1",
                total: 4
            },
                {
                    projectId: "cd574f2d-8f55-4f5c-8850-b37d01e123fc",
                    projectName: "襄武第三段",
                    buildTypeCode: "T",
                    jcb: "HSJC-2",
                    jlb: "HSJL-1",
                    sgb: "HSSG-1",
                    total: 3
                }
            ]
        }
    ];

实现代码如下:

var planData = [];
                          var map =[];
                          var data = reg.data;
                        for(var i=0;i<reg.data.length;i++){
                            var proData= {};
                            var xmData = {};
                            xmData.project = [];
                            var n = data[i].xmId;
                            xmData.xmId = data[i].xmId;
                            xmData.xmShortName = data[i].xmShortName;
                            proData.projectId = data[i].projectId;
                            proData.projectName = data[i].projectName;
                            proData.buildTypeCode = data[i].buildTypeCode;
                            proData.sgb = data[i].sgb;
                            proData.total = data[i].total;
                            if(!map[n]){
                                map[n] = data[i].total;
                                xmData.project.push(proData); //可能有问题
                                planData.push(xmData);
                            }
                            else{ //项目ID已存在
                                for(var j = 0; j < planData.length; j++){
                                    var aj = planData[j];
                                    if(aj.xmId == n){
                                        planData[j].project.push(proData);
                                        break;
                                    }
                                }
                            }
                        }  

          console.log(
planData);

 

转载于:https://www.cnblogs.com/qianxunpu/p/7144256.html

组装ElementUI树结构,我们需要在Vue的组件中使用ElementUI的Tree组件。首先,在Vue组件中导入Tree和TreeNode组件: ``` import { Tree, TreeNode } from 'element-ui' ``` 然后,在组件的template中使用Tree组件来组装树结构,可以设置树的数据源和各个节点的显示内容: ``` <template> <div> <el-tree :data="treeData"> <el-tree-node :label="node.label" :key="node.id" v-for="node in treeData" :children="node.children"> </el-tree-node> </el-tree> </div> </template> ``` 其中,`:data`属性绑定了树的数据源,而`:label`属性绑定了节点的显示内容。通过`:key`属性来唯一标识每个节点,`v-for`指令可以用来遍历树的数据源,`:children`属性可以用来指定子节点的数据源。 为了实现组装树结构的功能,我们还需要在Vue组件的script中定义树的数据源。可以将树的数据定义为一个对象数组,每个对象包括`label`、`id`和`children`等属性,用来描述节点的显示内容、唯一标识和子节点: ``` <script> export default { data() { return { treeData: [ { id: 1, label: '节点1', children: [ { id: 11, label: '子节点1-1', children: [ { id: 111, label: '孙子节点1-1-1' }, { id: 112, label: '孙子节点1-1-2' } ] }, { id: 12, label: '子节点1-2' } ] }, { id: 2, label: '节点2', children: [ { id: 21, label: '子节点2-1' }, { id: 22, label: '子节点2-2' } ] } ] } } } </script> ``` 通过定义树的数据源并将其绑定到Tree组件的`:data`属性上,就可以实现ElementUI树结构的组装。注意,根节点的数据源绑定在Tree组件上,而子节点的数据源则通过TreeNode组件的`:children`属性绑定。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值