Vue数组对象,数组中多个对象将colorName值相同的合并

**

这里使用到了Object.values(), xx.reduce((prev, cur, index))方法

**

首先这个数据源是长这样的

在这里插入图片描述

需要的效果是长这样
在这里插入图片描述
代码

skuSizeData 是数据源
skuSizePropData 是在此之前我将所有的尺码进行一个去重排序获取,插入到一个数组;例:[‘XL’, ‘2XL’]
xx.reduce方法prev为上一个元素,cur表示当前原始,最后有个{}, 意思是初始化一个空对象,每次返回一个对象
Object.values为获取对象的value值

// skuSizeData 是数据源
// skuSizePropData 是在此之前我将所有的尺码进行一个去重排序获取,插入到一个数组;例: ['XL', '2XL']
skuSizeData = Object.values(skuSizeData.reduce((prev: {
     
      [x: string]: any; }, cur: {
     
      [x: string]: any; colorName: string|number; }) => {
    
    
        if (prev[cur.colorName]) {
    
    
          skuSizePropData.forEach((item: string|number) => {
    
    
            if (cur[item]) prev[cur.colorName][item] = cur[item];
          });
        } else {
    
    
          prev[cur.colorName] = {
    
     ...cur };
        }
        return prev;
      }, {
    
    }));
    });

猜你喜欢

转载自blog.csdn.net/JunVei/article/details/128503042