提交按钮的防止重复点击设置

提交按钮的防止重复点击设置

封装一个文件 preventRepeatClick.js

export default {
  install (Vue) {
    // 防止重复点击
    Vue.directive('preventReClick', {
      inserted (el, binding) {
          console.log("binding-7",binding)
        el.addEventListener('click', () => {
          if (!el.disabled) {
            el.disabled = true
            setTimeout(() => {
              el.disabled = false
            },binding.value || 1000)
          }
        })
      }
    })
  }
}

在全局调用 main.js文件添加

import preventReClick from './core/preventRepeatClick' // 按钮连点处理
Vue.use(preventReClick)

在要做处理的按钮行里加上 v-preventReClick='设定的秒数'

提交