微信小程序防止重复点击按钮

发布时间 2023-10-25 10:54:26作者: 西门夜说
Page({
  data: {
    ......
    isclick: false, //点击防重标志
  },
  /**
   * 需要做防点击防重的单击事件
   */
  onclick: function() {
    var self = this
    if(!self.data.isclick){
      self.setData({
        isclick:true
      })
      setTimeout(function () {
        self.setData({
          isclick: false
        })
      }, 1000);
    }else{
      return;
    }
    ......
  }
   ......
})
//btn_click.js
//点击防重
let isClick=false;
let preventDuplicateClicks=function(){
  if (!isClick) {
    isClick=true    
    setTimeout(function () {
      isClick = false
    }, 1000);
    return false;
  } else {
    return true;
  }
}
module.exports = {
  preventDuplicateClicks: preventDuplicateClicks
}
import btnClick from '../../../../utils/btn_click';

Page({
  ......
  /**
   * 1.需要防重的单击事件
   */
  orderPay: function() {
  onSubmitConfirm(event) {
    let that = this
    if (btnClick.preventDuplicateClicks()) {
      return
    }

    wx.request({
      url: xxxxxxx, //仅为示例,并非真实的接口地址
      method: "POST",
      data: {
        
      },
      header: {
        'content-type': 'application/json' // 默认值
      },
      success(res) {
        let data = res.data
        console.log(res)
        wx.showToast({
          title: data.message,
          icon: 'success',
          duration: 2000,
        })

      },
      fail(res) {
        let data = res.data
        wx.showToast({
          title: data.message,
          icon: 'none',
          duration: 2000
        })
      },
      // 不论失败与否都会执行下面这个函数
      complete: () => {
        that.onSubmitCancel()
      }

    })




  },
})

转自:https://www.cnblogs.com/xyyt/p/10764372.html