vue阻止按钮重复点击，按钮点击延迟问题。一个指令解决，对任何元素生效。

1.在utils文件夹下新建preventReClick.js文件

export default {
    install(Vue) {
        Vue.directive('preventReClick', {
            inserted(el, binding) {
                el.addEventListener('click', () => {
                    const events = el.style.pointerEvents
                    if (events == "") {
                        el.style.pointerEvents = 'none'
                        setTimeout(() => {
                            el.style.pointerEvents = "";
                        }, binding.value || 1000);
                    }

                })
            }
        })
    }
}

2.main.js引入

//引入
import preventReClick from './utils/preventReClick'
//注册
Vue.use(preventReClick)

3.使用

这里直接填也可以 v-preventReClick 默认是1秒， v-preventReClick="2000" 表示延迟2秒

<div  class="icon-button"  @click="save" v-preventReClick="2000">