企业开发-微信小程序点击领取优惠卷进入卡包流程（保姆级）

最新推荐文章于 2024-02-02 09:27:01 发布

墨蓮～

最新推荐文章于 2024-02-02 09:27:01 发布

阅读量694

点赞数

文章标签：微信小程序前端 Powered by 金山文档

本文链接：https://blog.csdn.net/weixin_54040152/article/details/129546759

版权

前端篇

一、进入微信公众平台点击设置->第三方设置->添加插件->搜索微信支付券并添加

二、写代码

在app.json中添加以下代码

跟pages同级  

"plugins": {
    "sendCoupon": {
      "version": "latest",
      "provider": "APPID"  //这里写自己开发的appid别瞎抄
    }
  },

在需要点击领取的页面的json文件中加入

  "usingComponents": {
    "send-coupon": "plugin://sendCoupon/send-coupon"
  },

3.在需要点击领取的页面的wxml文件中加入

      <send-coupon bind:sendcoupon="getcoupon"  send_coupon_params="{{send_coupon_params}}"  sign="{{sign}}"  send_coupon_merchant="{{send_coupon_merchant}}" >
        <view class="padding-xs margin-top" bindtap='clickMask'>
       点击领取
      </view>

      </send-coupon>

4.在需要点击领取的页面的js文件中加入

page({
data:{
        // 卡包插件参数
    send_coupon_merchant:null,
    sign:null,
    send_coupon_params:[]
}，
onShow(){        //一般我在onshow拿,也可以onLoad时拿
//接口自己家后端写
//要三个重要参数 sign、send_coupon_merchant、send_coupon_params

        wx.request({
      url: 'url',
      method:'POST',
      header: {
        "Authorization": 'Bearer ' + `${token}`
      },
      data:{},
      success:(res)=>{
        if(res.data.code==0){
          this.setData({
            sign:res.data.data.sign,
            send_coupon_merchant:res.data.data.send_coupon_merchant,
            send_coupon_params:res.data.data.send_coupon_params
          })
        }
      }
    })

}

})

getcoupon(params){
    if(params.detail.errcode=="OK"){
      wx.showToast({
        title: '领取成功 可在微信钱包查看',
        icon: 'none',
        mask: 'true'
      })
    }
}

三、前端完活