vue 对象数组中，根据相同属性的数据合并，重组新的数组对象
20 浏览量
2021-01-20
12:49:52
上传
评论 1
收藏 28KB PDF 举报
vue 对象数组中，根据相同属性的数据合并，重组新的数组对对象数组中，根据相同属性的数据合并，重组新的数组对
象象
可以通过上次的需求，我们通过 TYPE 和 REMARK 两个 key 对应的 value 共同决定是否合并属性，我们是可以将两个属性进
行串联成一个新的 key，如果这个 key 相同，即两个条件同时满足。这里不仅仅合并相邻的数据，不相邻的同种 属性也会进
行合并。
源数据：
let data = [
{"TYPE": "01", "REMARK": "休假"},
{"TYPE": "03", "REMARK": "在班"},
{"TYPE": "03", "REMARK": "在班"},
{"TYPE": "02", "REMARK": "上海出差"},
{"TYPE": "02", "REMARK": "北京出差"},
{"TYPE": "04", "REMARK": "休息"},
{"TYPE": "04", "REMARK": "休息"}
]
目标数据：
[{
"TYPE": "01", "REMARK": "休假", "KEY": "01休假", "COUNT": 1}, {
"TYPE": "03", "REMARK": "在班", "KEY": "03在班", "COUNT": 2}, {
"TYPE": "04", "REMARK": "休息", "KEY": "04休息", "COUNT": 2}, {
"TYPE": "02", "REMARK": "上海出差", "KEY": "02上海出差", "COUNT": 1}, {
"TYPE": "02", "REMARK": "北京出差", "KEY": "02北京出差", "COUNT": 1
}]
首页我们创建 KEY 属性，KEY 的 value 有 TYPE 和 REMARK 的 value 决定。代码如下：
let newdata = [] for (let k in data) {
newdata.push({
...data[k],
KEY: data[k].TYPE + data[k].REMARK,
})
}
console.log(newdata)
结果如下：
[{ "TYPE": "01", "REMARK": "休假", "KEY": "01休假"}, { "TYPE": "03", "REMARK": "在班", "KEY": "03在班"}, {
"TYPE": "03", "REMARK": "在班", "KEY": "03在班"}, { "TYPE": "04", "REMARK": "休息", "KEY": "04休息"}, {
"TYPE": "02", "REMARK": "上海出差", "KEY": "02上海出差"}, { "TYPE": "02", "REMARK": "北京出差", "KEY": "02北京出差"}, {
"TYPE": "04", "REMARK": "休息", "KEY": "04休息"}]
下面我们进行相同属性的数据进行合并，达目如下
let result = [] let map = {}
for(let k = 0; k < newdata.length; k++) {
if(!map[newdata[k].KEY]) {
result.push({
...newdata[k],
COUNT: 1
})
map[newdata[k].KEY] = newdata[k] }else {
for(let j = 0; j < result.length; j++){
if(result[j].KEY== newdata[k].KEY){
result[j].COUNT++
break;
}
}
}
}
console.log(result)
作者：qq_36437172
资源评论
