vk-u-goods-sku-popup 是一个商品多规格sku选择器组件。此插件为vk-unicloud-router插件的一部分独立出来而形成的。
基本使用示例
<vk-u-goods-sku-popupv-model="sku_key":custom-action="findGoodsInfo":mode="1"border-radius="20"@add-cart="addCart"@buy-now="buyNow"></vk-u-goods-sku-popup>methods:{//加入购物车前的判断addCartFn(obj){let{selectShop}=obj;//模拟添加到购物车,请替换成你自己的添加到购物车逻辑letres={};letname=selectShop.goods_name;if(selectShop.sku_name!="默认"){name+="-"+selectShop.sku_name;}res.msg=`${name}已添加到购物车`;if(typeofobj.success=="function")obj.success(res);},//加入购物车按钮addCart(selectShop){console.log("监听-加入购物车");that.addCartFn({selectShop:selectShop,success:function(res){//实际业务时,请替换自己的加入购物车逻辑that.toast(res.msg);}});},//立即购买buyNow(selectShop){console.log("监听-立即购买");that.addCartFn({selectShop:selectShop,success:function(res){//实际业务时,请替换自己的立即购买逻辑that.toast("立即购买");}});},/***获取商品信息*这里可以看到每次打开SKU都会去重新请求商品信息,为的是每次打开SKU组件可以实时看到剩余库存*/findGoodsInfo(){returnnewPromise(function(resolve,reject){//这里是获取商品信息的后端请求,可以用你自己的方式请求获取,本例子中用的是unicloud的云函数获取商品信息that.callFunction({success(data){resolve(data.goodsInfo);}});});},toast(msg){uni.showToast({title:msg,icon:"none"});},callFunction(obj){uni.showLoading({title:'请求中'});uniCloud.callFunction({name:'findGoodsInfo',data:{goods_id:that.goods_id},success(res){console.log(res);if(typeofobj.success=="function")obj.success(res.result);},fail(err){console.error(err);},complete(){uni.hideLoading();}});},}
评论