vue防止连续点击按钮，频繁调接口

新建一个plugins.js

export default {
    install (Vue) {
      // 防重复点击(指令实现)
      Vue.directive('preventReClick', {
        inserted (el, binding) {
          el.addEventListener('click', () => {
            if (!el.disabled) {
              el.disabled = true
              setTimeout(() => {
                el.disabled = false
              }, binding.value || 3000)
            }
          })
        }
      })
    }
  }

在main.js中引入

import preventReClick from '../plugins/plugins.js'

在需要的页面中引入

import preventReClick from '../../plugins/plugins'

在按钮上加上 v-preventReClick 就好了

<el-button size="mini" @click="deleteGoods(scope.$index, scope.row)" icon="el-icon-delete" v-preventReClick></el-button>