vue 防连点 自定义指令（亲测可用）

// 代码
const pointDoms = []; // 使用这个指令的所有DOM对象
Vue.directive('points', {
    inserted(el, binding) {
        pointDoms.push(el); // 存储使用这个指令的DOM
        el.addEventListener('click', () => {
            // 禁用所有使用这个指令的DOM结构点击事件
            pointDoms.forEach(pointItem => {
                pointItem.style.pointerEvents = 'none';
            });
            setTimeout(() => {
                // 启动所有使用这个指令的DOM结构点击事件
                pointDoms.forEach(pointItem => {
                    pointItem.style.pointerEvents = 'auto';
                });
            }, binding.value || 350);
        });
    }
});

<!-- 使用 -->

<!-- 默认防连点 间隔 350毫秒 -->
<div v-points></div>

<!-- 自定义设置 防连点 间隔 300毫秒 -->
<div v-points="300"></div>

如果对你有帮助，记得 点赞，收藏哦，我GitHub地址是：https://github.com/zhukunpenglinyutong 欢迎交流