click vue 重复调用_vue防重复点击(指令实现)

防重复点击或提交，在项目中是必不可少，如果封装成一个组件，但是点击的按钮的样式千差万别，有和有

各种实现，很难做到通用，然后就想到了用指令去实现。

直接上代码：

1、定义一个指令Vue.directive('preventReClick', {

inserted (el, binding) {

el.addEventListener('click', () => {      if (!el.disabled) {

el.disabled = true

setTimeout(() => {

el.disabled = false

}, binding.value || 2000)

}

})

}

})

html

javascriptpay (event) {        if (event.target.disabled) {          // 点击太频繁了

return

}

...

}

作者：竿牍

链接：https://www.jianshu.com/p/c13800c9a09e