Vue 前端框架中限制用戶短期內屢次點擊同一按鈕的方法（例如：登陸、註冊）

1、首先在項目目錄（自定義）下建立'controlClickState.js'文件，後在文件中定義以下內容：

// controlClickState.js 文件

export default {
  install(Vue) {
    // 禁止短期內重複點擊
    Vue.directive('preventClick', {
      inserted(button, bind) {
        button.addEventListener('click', () => {
          if (!button.disabled) {
            button.disabled = true;
            setTimeout(() => {
              but.disabled = false
            }, 6000)
          }
        })
      }
    })
  }
}

2、在項目目錄下的 main.js 入口文件引用定義好的 'controlClickState.js'文件

import preventClick from '../static/js/controlClickState'
Vue.use(preventClick)

3、在須要限制點擊頻率的組件中使用

<button v-preventClick>登陸</button>