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>

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); } }) })() 使用 点击