關於微信小程序控制多次提交的方法

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

官方文檔: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即可。

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章