1、定义全局指令文件 Vue.directive
import Vue from 'vue'
// 自定义指令防止按钮重复点击 v-preventReClick(使用时)
const preventReClick = Vue.directive('preventReClick', {
inserted: function (el, binding) {
el.addEventListener('click', () => {
console.log(11111)
console.log(el)
if (!el.disabled) {
el.disabled = true
el.style.opacity = '0.5'
el.style.cursor = 'not-allowed'
setTimeout(() => {
el.disabled = false
el.style.opacity = '1'
el.style.cursor = ''
}, binding.value || 1500)
}
})
}
})
export default preventReClick
2、mainjs中引用
import preventReClick from './plugins/plugins'
Vue.use(preventReClick)
3、在需要的地方使用