商品浏览记录分页,相同日期商品数据合并 demo。
用户在商城浏览过的商品都会被记录下来,进入浏览记录可以看到浏览过的商品,浏览记录是分页的,而在分页之后要把新情求的数,根据相同日期和之前的数据做个对比相同日期的数据要放在以前符合用户浏览习惯。
下方有代码demo和结果
代码:
<script>
let arr1 = [{ // 第一页数据
date: '2021年03月30日',
browseRecords: [{
name: '小名30-1'
},
{
name: '小名30-2'
}
]
}, {
date: '2021年03月29日',
browseRecords: [{
name: '小名29-1'
},
{
name: '小名29-2'
},
]
}];
let arr2 = [{ // 第二页新请求的数据
date: '2021年03月29日',
browseRecords: [{
name: '小名29-3'
},
{
name: '小名29-4'
},
{
name: '小名29-5'
},
]
}, {
date: '2021年03月28日',
browseRecords: [{
name: '小名28-1'
},
{
name: '小名28-2'
}
]
}]
let arr = arr1.concat(arr2).reduce((groups, item) => {
let resultArr = groups.find(arrItem => item.date === arrItem.date); // 找出相同日期的数据
if (resultArr) {
resultArr.browseRecords = resultArr.browseRecords.concat(item.browseRecords)
} else {
var newGroup = {
date: item.date,
browseRecords: item.browseRecords,
}
groups.push(newGroup);
}
return groups;
}, []);
console.log('合并数据后', arr);
</script>