Vue全局指令防止按钮重复点击

1.common.js

首先引入Vue

import Vue from 'vue';

const preventReClick = Vue.directive('preventReClick', {
  inserted: function (el, binding) {
    el.addEventListener('click', () => {
      if (!el.disabled) {
        el.disabled = true
        setTimeout(() => {
          el.disabled = false
        }, binding.value || 3000)
      }
      console.log(el.disabled)
    })
  }
});

export {
  preventReClick
}

2.在需要引入的页面引入（**.vue）

在按钮上添加v-preventReClick

<el-button  size="small" type="primary" @click="handleSave('form')" v-preventReClick>确定</el-button>

从common.js导入指令preventReClick

import preventReClick from '../common' //防多次点击，重复提交