关于微信小程序控制多次提交的方法

第一种 直接使用微信小程序

官方文档:https://developers.weixin.qq.com/miniprogram/dev/api/ui/interaction/wx.showLoading.html

wx.showLoading({
  title: '加载中',
})

具体代码可以这样子实现:

用户点击按钮后出发comit方法一开始是就直接调用showloading在接口掉完以后再complete方法中使用hideloading隐藏一开始的加载遮罩层

 comit() {
    wx.showLoading({
      title: '加载中',
      mask: true
    })
    var that = this;
    var data = {
      // isReceiveGoods: this.data.isReceiveGoods,
      refundAmount: this.data.money,
      refundReasonCode: this.data.num,
      subOrderCode: this.data.code,
      refundType: this.data.chooseRefundType,
      refundMemoToseller: this.data.remark,
    }
    console.log(data);
    if (that.data.recordIdImg) {
      data.resourceId = that.data.recordIdImg.join(',')
    };
    //正则表达式验证输入金额只能为数字或小数点后两位
    var verifyMoney = /^([0-4][0-9]{9}|[0-9]{1,9})(\.[0-9][0-9]?)?$/
    if (!verifyMoney.test(that.data.money)) {
      wx.showToast({
        title: "订单金额格式错误",
        icon: 'none',
      })
      return;
    }
    if (that.data.money == 0) {
      wx.showToast({
        title: '退款金额不能为0',
        icon: 'none',
      })
      return;
    }
    //判断  若输入金额大于实付金额 则报错
    if (that.data.money > that.data.refundPrice) {
      wx.showToast({
        title: '退款不能大于实付金额',
        icon: "none"
      })
      return;
    }
    that.setData({
      boCommit: true
    })
    $.post({
      url:'orderRefund/create',
      port:'order',
      data:data,
      success:res=>{
        if (res.code == 0) {
          wx.showToast({
            title: '申请成功',
            icon: 'none',
            success: function () {
              wx.navigateBack({
                delta: 1
              })
            }
          })
        } else {
          that.setData({
            boCommit: false
          })
          wx.showToast({
            title: res.msg,
            icon: 'none',
          })
          return;
        }
      },
      fail:function(){
      },
      complete() {
        wx.hideLoading()
      }
    })
  },
  //提交跳转至订单详情
  gotoOrder: function () {
    wx.navigateTo({
      url: '/subPackages/trade/account/account?fromPage=order',
    })
  }

 第二种就是直接自己判断

在data中设置一个属性为false,每次一触发就设置为true然后判断当他为true的时候就不能再次点击 

  if (this.data.isClickPay) {
      wx.showToast({
        title: '请勿重复点击',
        icon: 'none'
      })
      return
    }
    this.setData({
      isClickPay:true
    })

this.setData可以更改为this.data.isClickPay如果页面中不使用isClickPay字段。因为this.setData是页面更新是需要的 仅仅字段更新就使用this.data即可。

你可能感兴趣的:(小程序,控制用户重复提交)