1.stopBtnRepeat.js
// 阻止按钮重复提交 import Vue from 'vue' Vue.directive("stopBtnRepeat", { bind: function (el, binding) { function clickHandler(e) { if (el.contains(e.target)) { if (!el.disabled) { el.disabled = true setTimeout(() => { el.disabled = false }, binding.value || 3000) } return false; } } el.bffClick = clickHandler; document.addEventListener('click', clickHandler); }, unbind(el) { document.removeEventListener('click', el.bffClick); delete el.bffClick; }, })
2.main.js中引入
3.使用
噢里给!一个简单的全局自定义指令阻止按钮重复点击完成!
已添加至我的基础开发模板里:https://gitee.com/bfflxb/vue-cli3-template