JS种对数组数据进行分组及动态生成table表格
1、对数组数据进行分组
var arr = [
{"id":"1001","name":"值1","value":"111"},
{"id":"1001","name":"值1","value":"11111"},
{"id":"1002","name":"值2","value":"25462"},
{"id":"1002","name":"值2","value":"23131"},
{"id":"1002","name":"值2","value":"2315432"},
{"id":"1003","name":"值3","value":"333333"}
];
var map = {},
dest = [];
for(var i = 0; i < arr.length; i++){
var ai = arr[i];
if(!map[ai.id]){
dest.push({
id: ai.id,
name: ai.name,
data: [ai]
});
map[ai.id] = ai;
}else{
for(var j = 0; j < dest.length; j++){
var dj = dest[j];
if(dj.id == ai.id){
dj.data.push(ai);
break;
}
}
}
}
console.log(dest);
2、动态生成table表
下面代码是在实际开发中根据选中的两个复选框列表动态的创建table，并且创建表格时保留了原始数据
//选择服务企业类型时更换表格展示内容
handleCheckedEntTypeChange(){
if(this.serviceEntType){
this.serviceEntType.sort()
//获取选中服务企业类型,转成中文名称
var typeNameList = new Array()
for(var i=0;i
case 1 : typeNameList.push('合资')
break;
case 2 : typeNameList.push('独资')
break;
case 3 : typeNameList.push('国有')
break;
case 4 : typeNameList.push('私营')
break;
case 5 : typeNameList.push('全民所有制')
break;
case 6 : typeNameList.push('集体所有制')
break;
case 7 : typeNameList.push('股份制')
break;
default: typeNameList.push('其他')
}
}
this.serviceTypeNameList = typeNameList
}
//生成总的表格数据
var financingScope = new Array()
for(var i=0;i
var obj1 = new Object()
obj1.enterpriseLevelId = this.serviceEntRat[i]
//根据企业等级Id 获取对应的名称
switch(obj1.enterpriseLevelId) {
case 1 : obj1.enterpriseLevelName ='AAA'
break;
case 2 : obj1.enterpriseLevelName ='AA'
break;
case 3 : obj1.enterpriseLevelName ='A'
break;
case 4 : obj1.enterpriseLevelName ='B'
break;
case 5 : obj1.enterpriseLevelName ='C'
break;
default: obj1.enterpriseLevelName ='其他'
}
var oldtypeAndMaxList = new Array()
for(var k=0;k
oldtypeAndMaxList = this.financingScope[k].typeAndMaxList
}
}
//在原来老数据的基础上生成新数据数组
var newtypeAndMaxList = new Array()
for(var j=0;j
for(var m=0; m
obj2.enterpriseTypeId = oldtypeAndMaxList[m].enterpriseTypeId
obj2.financingMax = oldtypeAndMaxList[m].financingMax
}
}
if(!obj2.enterpriseTypeId){
obj2.enterpriseTypeId = this.serviceEntType[j]
obj2.financingMax = 0
}
newtypeAndMaxList.push(obj2)
}
obj1.typeAndMaxList = newtypeAndMaxList
financingScope.push(obj1)
}
this.financingScope = financingScope
},
//选择服务等级时更换封装数据
handleCheckedEntRatChange(){
this.serviceEntRat.sort()
//生成总的表格数据
var financingScope = new Array()
for(var i=0;i
var obj1 = new Object()
obj1.enterpriseLevelId = this.serviceEntRat[i]
//根据企业等级Id 获取对应的名称
switch(obj1.enterpriseLevelId) {
case 1 : obj1.enterpriseLevelName ='AAA'
break;
case 2 : obj1.enterpriseLevelName ='AA'
break;
case 3 : obj1.enterpriseLevelName ='A'
break;
case 4 : obj1.enterpriseLevelName ='B'
break;
case 5 : obj1.enterpriseLevelName ='C'
break;
default: obj1.enterpriseLevelName ='其他'
}
var oldtypeAndMaxList = new Array()
for(var k=0;k
oldtypeAndMaxList = this.financingScope[k].typeAndMaxList
}
}
//在原来老数据的基础上生成新数据数组
var newtypeAndMaxList = new Array()
for(var j=0;j
if(oldtypeAndMaxList.length>0){
for(var m=0; m
obj2.enterpriseTypeId = oldtypeAndMaxList[m].enterpriseTypeId
obj2.financingMax = oldtypeAndMaxList[m].financingMax
}
}
}else{
obj2.enterpriseTypeId = this.serviceEntType[j]
obj2.financingMax = 0
}
newtypeAndMaxList.push(obj2)
}
obj1.typeAndMaxList = newtypeAndMaxList
financingScope.push(obj1)
}
this.financingScope = financingScope
},