vue防止按钮在短时间内被多次点击的方法

vue组件

(function(){
let openDelay=false;
Vue.directive('intervalclick', function(el,binding){
el.onclick=function(e){
if(openDelay)return;
openDelay=!openDelay;
if (!binding.value) {
alert("未传入Value数据！");
return;
}
let func = binding.value['func'];
let time=binding.value['time'];
if(typeof time !=='number'){
alert("传入等待时间错误");
return;
}
let args=[];
for (const key in binding.value) {
if (binding.value.hasOwnProperty(key)) {
if(key==='func'||key==='time')continue;
args.push(binding.value[key])
}
}
setTimeout(() => {
openDelay=!openDelay;
}, time);
func(...args);
}
})
})()

使用

<button v-intervalclick='{func:执行方法,time:间隔时间(毫秒数),...执行方法所需要的参数}'>点击</button>