在utils文件下创建preventRepeatClick.js文件
export default {
install(Vue) {
Vue.directive('preventReClick', {
inserted(el, binding) {
el.addEventListener('click', () => {
if (!el.disabled) {
el.disabled = true
setTimeout(() => {
el.disabled = false
// 默认1秒内禁止再次提交
}, binding.value || 1000)
}
})
}
})
}
}
在main.js 中调用
import preventReClick from'@/utils/preventRepeatClick.js'
Vue.use(preventReClick)
页面使用
// 三秒内不在重复点击 可自行修改
<el-buttonv-preventReClick=“3000”>按钮</el-button>