vue-按钮指令防抖

23 阅读1分钟
preventReclick.js文件封装全局指令v-preventReClick;

export default {

  install(Vue) {

​    Vue.directive('preventReClick', {

​      inserted: function (el, binding) {

​        el.addEventListener('click', (e) => {

​          if (!el.disabled) {

​            el.disabled = truesetTimeout(() => {

​              el.disabled = false

​            }, binding.value || 1000)

​            //binding.value可以自行设置。如果设置了则跟着设置的时间走//例如:v-preventReClick='500'

​          } else { // disabled为true时,阻止默认的@click事件

​            e.preventDefault()

​            e.stopPropagation()

​          }

​        })

​      }

​    })

  }

}