vk-u-goods-sku-popup商品 sku 選擇器組件

vk-u-goods-sku-popup 是一個(gè)商品多規(guī)格 sku 選擇器組件。此插件為 vk-unicloud-router 插件的一部分獨(dú)立出來(lái)而形成的。

基本使用示例

<vk-u-goods-sku-popup
  v-model="sku_key" 
  :custom-action="findGoodsInfo"
  :mode="1"	
  border-radius="20"
  @add-cart="addCart"
  @buy-now="buyNow"
></vk-u-goods-sku-popup>

methods: {
  // 加入購(gòu)物車(chē)前的判斷
  addCartFn(obj) {
    let {
      selectShop
    } = obj;
    // 模擬添加到購(gòu)物車(chē),請(qǐng)?zhí)鎿Q成你自己的添加到購(gòu)物車(chē)邏輯
    let res = {};
    let name = selectShop.goods_name;
    if (selectShop.sku_name != "默認(rèn)") {
      name += "-" + selectShop.sku_name;
    }
    res.msg = `$ {name}已添加到購(gòu)物車(chē)`;
    if (typeof obj.success == "function") obj.success(res);
  },
  // 加入購(gòu)物車(chē)按鈕
  addCart(selectShop) {
    console.log("監(jiān)聽(tīng) - 加入購(gòu)物車(chē)");
    that.addCartFn({
      selectShop: selectShop,
      success: function(res) {
        // 實(shí)際業(yè)務(wù)時(shí),請(qǐng)?zhí)鎿Q自己的加入購(gòu)物車(chē)邏輯
        that.toast(res.msg);
      }
    });
  },
  // 立即購(gòu)買(mǎi)
  buyNow(selectShop) {
    console.log("監(jiān)聽(tīng) - 立即購(gòu)買(mǎi)");
    that.addCartFn({
      selectShop: selectShop,
      success: function(res) {
        // 實(shí)際業(yè)務(wù)時(shí),請(qǐng)?zhí)鎿Q自己的立即購(gòu)買(mǎi)邏輯
        that.toast("立即購(gòu)買(mǎi)");
      }
    });
  },
  /**
   * 獲取商品信息
   * 這里可以看到每次打開(kāi)SKU都會(huì)去重新請(qǐng)求商品信息,為的是每次打開(kāi)SKU組件可以實(shí)時(shí)看到剩余庫(kù)存
   */
  findGoodsInfo() {
    return new Promise(function(resolve, reject) {
      // 這里是獲取商品信息的后端請(qǐng)求,可以用你自己的方式請(qǐng)求獲取,本例子中用的是unicloud的云函數(shù)獲取商品信息
      that.callFunction({
        success(data) {
          resolve(data.goodsInfo);
        }
      });
    });
  },
  toast(msg) {
    uni.showToast({
      title: msg,
      icon: "none"
    });
  },
  callFunction(obj) {
    uni.showLoading({
      title: '請(qǐng)求中'
    });
    uniCloud.callFunction({
      name: 'findGoodsInfo',
      data: {
        goods_id: that.goods_id
      },
      success(res) {
        console.log(res);
        if (typeof obj.success == "function") obj.success(res.result);
      },
      fail(err) {
        console.error(err);
      },
      complete() {
        uni.hideLoading();
      }
    });
  },
}