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

官方文档：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即可。