3小时实战入门小程序云开发(托管小程序云开发-052-)
2、接收到的规格数组
"product_sku": [
{
"prod_id": "6d85a2b962c55aa90ee369061d16c305",
"sku_name": "全托班",
"sku_price": 4888,
"sku_properties": ["餐饮:午餐 晚餐", "休息:午休", "其他:作业辅导"],
"sku_stock": 16,
"sku_price": 32,
"_id": "b69f67c062cf7d120b0a37880f7add15"
},
{
"prod_id": "6d85a2b962c55aa90ee369061d16c305",
"sku_default": true,
"sku_name": "午托班",
"sku_price": 3800,
"sku_properties": ["餐饮:午餐", "休息:午休", "其他:无"],
"sku_stock": 18,
"sku_price": 24,
"_id": "f6e08a6462cf76490c4326ad233eb96d"
}
1、全部的SKU对象(包含所有的规格名和对应的属性值集合): skuGroup
let skuGroup = {}//全部的SKU对象(包含所有的规格名和对应的属性值集合),循环显示的依据
/**{
* 休息:["午休"],
* 餐饮:["午餐 晚餐","午餐"],
* 其他:["作业辅导","无"]
* },
*/
let propKeys = []//SKU规格名数组,
/**
* ["餐饮","休息","其他"]
*/
let allProperties = []//SKU规格值(属性)数组,
/**
* ["餐饮:午餐 晚餐","休息:午休","其他:作业辅导","餐饮:午餐","休息:午休","其他:无"]
*/
let selectedPropObj={} //选中的SKU对象,就是获取的sku数组的第一个sku
/**
* {餐饮: "午餐 晚餐", 休息: "午休", 其他: "作业辅导"}
*/
let selectedProp = [] //选中的SKU值数组
/**
* ["午餐 晚餐", "午休", "作业辅导"]
*/
let selectedSku={} //选中的SKU完整数据对象(带价格)
/**
* {
* _id: "b69f67c062cf7d120b0a37880f7add15",
* prod_id: "6d85a2b962c55aa90ee369061d16c305",
* sku_name: "全托班",
* sku_price: 4888,
* sku_properties: Array(3),
* sku_stock: 18,
* sku_total: 24
* }
*/)
findSku: true, //是否有选中的sku
data: {
autoplay:true,
currentSwiper:0, //当前幻灯片序号
currentTab: 0, // tab选项卡(商家详情、规格参数)
product: null, //商品详情
//规格对应参数
skuList: [], //商品规格数组
skuGroup:{},// 全部的SKU对象(包含所有的规格名和对应的属性值集合)
propKeys:[],//SKU规格值(属性)数组 ["餐饮:午餐 晚餐","休息:午休","其他:作业辅导","餐饮:午餐","休息:午休","其他:无"]
allProperties:[],// SKU规格值(属性)数组
selectedPropObj: {}, //选中的SKU对象
selectedProp:[] ,// 选中的SKU值数组
selectedSku:{}, //选中的SKU完整数据对象(带价格,库存数量,总量)
findSku: true, //是否有选中的sku
prodNum:1, //已选择商品数量,默认为1
skuShow: false, //是否显示sku规格弹窗
},
/**
* 根据skuList进行数据组装
*/
_groupSkuProp: function() {
const skuList = this.data.skuList; //sku数组
let skuGroup = {}//全部的SKU对象(包含所有的规格名和对应的属性值集合),循环显示的依据
/**{
* 休息:["午休"],
* 餐饮:["午餐 晚餐","午餐"],
* 其他:["作业辅导","无"]
* },
*/
let allProperties = []//SKU规格值(属性)数组,
/**
*["餐饮:午餐 晚餐","休息:午休","其他:作业辅导","餐饮:午餐","休息:午休","其他:无"]
*/
let propKeys = []//SKU规格名数组,
/**
* ["餐饮","休息","其他"]
*/
let selectedPropObj={} //选中的sku对象,就是获取的sku数组的第一个sku
/**
* {餐饮: "午餐 晚餐", 休息: "午休", 其他: "作业辅导"}
*/
for (var i = 0; i < skuList.length; i ) {
let properties = skuList[i].sku_properties //该sku的属性值,是一个数组
/**
* ["餐饮:午餐 晚餐","休息:午休","其他:作业辅导"]
*/
allProperties.push(...properties) //ES6数组拼接
//处理属性值数组
let propList = properties
for (var j = 0; j < propList.length; j ) {
let propval = propList[j].split(":"); //字符串分隔 为key,value
let props = skuGroup[propval[0]]; //先取出 规格名 "餐饮"
//选中的sku对象,就是sku数组的sku_default属性为true的那个个sku,把对应的属性值 组装到selectedProp
if (skuList[i].sku_default) {
const key=propval[0]
const value= propval[1]
selectedPropObj[key] = value
}
//如果规格名数组中没有当前规格名,将其加入规格名数组
const index=propKeys.findIndex(item=>item==propval[0])
if (index<0){
propKeys.push(propval[0]); //propKeys:SKU规格名数组
}
if (props == undefined) {
props = []; //还没有,新建个新的空数组
props.push(propval[1]); //把规格的值 "午餐" 放进空数组
} else {
if (!this.array_contain(props, propval[1])) { //如果数组里面没有"午餐"
props.push(propval[1]); //把 "午餐" 放进数组
}
}
skuGroup[propval[0]] = props; //最后把数据 放回规格对象对应的值
}
}
this.setData({
skuGroup,//全部的SKU对象(包含所有的规格名和对应的属性值集合)
propKeys, //SKU规格值(属性)数组 ["餐饮:午餐 晚餐","休息:午休","其他:作业辅导","餐饮:午餐","休息:午休","其他:无"]
allProperties,// SKU规格值(属性)数组
selectedPropObj,//选中的SKU对象
})
console.log('skuGroup=',skuGroup)
console.log('propKeys=',propKeys)
console.log('allProperties=',allProperties)
console.log('selectedPropObj=',selectedPropObj)
this._parseSelectedObjToVals();
},
将选中的 {key:val,key2:val2}转换成 [val,val2]
2、并找出选中的SKU完整数据对象:根据选中的SKU字符串,在skuList中找到SKU完整数据对象
/**
* 将选中的SKU对象进行处理
* 1、转换为SKU值数组:
* 将选中的 {key:val,key2:val2}转换成 [val,val2]
* 2、并找出选中的SKU完整数据对象:
* 根据选中的SKU字符串,在skuList中找到SKU完整数据对象
*/
_parseSelectedObjToVals: function() {
let selectedPropObj = this.data.selectedPropObj; //选中的SKU对象
let selectedProperties = "" //选中的SKU字符串,临时变量
/**
* 餐饮:午餐 晚餐;休息:午休;其他:作业辅导
*/
let selectedProp = [] //选中的SKU值数组
/**
* ["午餐 晚餐", "午休", "作业辅导"]
*/
for (var key in selectedPropObj) {
selectedProp.push(selectedPropObj[key]);
selectedProperties = key ":" selectedPropObj[key] ";";
}
selectedProperties = selectedProperties.substring(0, selectedProperties.length - 1); //去读最后一个分号;
console.log('selectedProp=',selectedProp)
this.setData({
selectedProp: selectedProp
});
//将选中的SKU字符串和skuList中的SKU进行比对,查找出选中的SKUSKU完整数据对象
let selectedSku={} //选中的SKU完整数据对象(带价格)
/**
* {
* _id: "b69f67c062cf7d120b0a37880f7add15",
* prod_id: "6d85a2b962c55aa90ee369061d16c305",
* sku_name: "全托班",
* sku_price: 4888,
* sku_properties: Array(3)
* }
*/
let findSku = false;
for (var i = 0; i < this.data.skuList.length; i ) {
const sku_properties=this.data.skuList[i].sku_properties
//sku数组转成字符串
let sku_properties_str=sku_properties.join(";")
if (sku_properties_str == selectedProperties) {
findSku = true
selectedSku= this.data.skuList[i] //选中的SKU完整数据对象(带价格,数量)
let product=this.data.product
//修改数量,库存和总数
product.product_stock=selectedSku.sku_stock
product.product_total=selectedSku.sku_total
//修改商品价格
product.product_price=selectedSku.sku_price
this.setData({
selectedSku,
product
});
break;
}
}
this.setData({
findSku
});
console.log('selectedSku=',selectedSku)
console.log('findSku=',findSku)
},
/**
* 判断数组是否包含某对象
*/
array_contain: function(array, obj) {
for (var i = 0; i < array.length; i ) {
if (array[i] == obj)
return true;
}
return false;
},
免责声明:本文仅代表文章作者的个人观点,与本站无关。其原创性、真实性以及文中陈述文字和内容未经本站证实,对本文以及其中全部或者部分内容文字的真实性、完整性和原创性本站不作任何保证或承诺,请读者仅作参考,并自行核实相关内容。文章投诉邮箱:anhduc.ph@yahoo.com