vue中通过笛卡尔积算法实现sku组合

4,847 阅读1分钟

mounted() { 
   let colorArray = ['白色','红色','黑色'] //选择的颜色
   let sizeArray = ['X','XL','XXL']   //选择的尺寸
   let allArray =[]  //组合数组 格式为:[[],[]]
   allArray.push(colorArray) 
   allArray.push(sizeArray)  
   this.cartesianProductOf.apply(this,allArray);  //调用笛卡尔积方法
},
 methods: {
    cartesianProductOf:function(){ //笛卡尔积
      return Array.prototype.reduce.call(arguments,function(a, b) {
      var ret = [];
        a.forEach(function(a) {
          b.forEach(function(b) {
             ret.push(a.concat([b]));
          });
        });
      console.log(ret)  //组合成功   
      return ret;
      }, [[]]);
    },
}

首先组合成allArray的格式如下图所示 


最后组合成功的sku如下图所示