// 代码
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 欢迎交流
点击查看更多内容
2人点赞
评论
共同学习,写下你的评论
评论加载中...
作者其他优质文章
正在加载中
感谢您的支持,我会继续努力的~
扫码打赏,你说多少就多少
赞赏金额会直接到老师账户
支付方式
打开微信扫一扫,即可进行扫码打赏哦