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);
        });
    }
});

　　

<!-- 使用 -->

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

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

　　

参考地址：https://www.imooc.com/article/300317