Uniapp點擊按鈕防抖操作

一、在根目錄下新建common文件並創建common.js文件，輸入下面代碼

// 防止處理多次點擊
function noMultipleClicks(methods, info) {
    // methods是需要點擊后需要執行的函數， info是點擊需要傳的參數
    let that = this;
    if (that.noClick) {
        // 第一次點擊
        that.noClick= false;
        if(info && info !== '') {
            // info是執行函數需要傳的參數
            methods(info);
        } else {
            methods();
        }
        setTimeout(()=> {
            that.noClick= true;
        }, 2000)
    } else {
        // 這里是重復點擊的判斷
    }
}
//導出
export default {
    noMultipleClicks,//禁止多次點擊
}

二、man.js文件引入

//配置公共方法
import common from './common/common.js'
Vue.prototype.$noMultipleClicks = common.noMultipleClicks;

三、在實際頁面中引用，不帶參數,直接傳一個方法就行

//記得在data中掛載   noClick:true
data() {
    return {
        noClick:true,
    }
},

<view class="bottom-btn-box">
    <view class="submit-btn" @click="$noMultipleClicks(commitWork)">提交</view>
</view>

methods:{
    commitWork(){
        //balabala
    }           
}

四、在實際頁面中引用，帶參數,傳一個方法和一個參數就行

//記得在data中掛載   noClick:true
data() {
    return {
        noClick:true,
    }
},
<view class="bottom-btn-box">
  <view class="pay" @click.stop="$noMultipleClicks(goPay, item)" >支付</view>
</view>

methods:{
    goPay(item){
        //balabala
    }           
}