vue防止用户在短时间内快速点击按钮多次

思路：

利用定时器，在一定时间内将按钮禁用，如500ms。

实现：

1、新建全局事件（保证用起来方便，不需要用一次写一次）

新建preventMultiClick.js文件

export default {
  install(Vue) {
    Vue.directive('preventMultiClick', {
      inserted(el_button, bind) {
        el_button.addEventListener('click', () => {
          if (!el_button.disabled) {
            el_button.disabled = true;
            setTimeout(() => {
              el_button.disabled = false
            }, bind.value||500)
          }
        })
      }
    })
  }
}

2、在main.js引入上面新建的js文件

import preventMultiClick from './utils/preventMultiClick';

Vue.use(preventMultiClick)

3、使用

<el-button @click="individual" v-preventMultiClick="5000">点击</el-button>

此处设置时间为5秒，不设置为500ms。