vue全局增加防连点

312 阅读1分钟

在项目开发中,我们会遇到很多不是我们整体开发的项目.那像这种整体的点击事件需要加防连点,我们要怎麽办呢?了解一点源码的同学都会想到从vue事件捕获这里去处理.

整体理解一点类似装饰器模式,拿到触发的事件后.给他包裹一层延时器;然后再放入vue事件队列中.

const on = Vue.prototype.$on
// 防抖处理
Vue.prototype.$on = function (event:any, func:any) {
  console.info("event",event)
  let timer:any
  let newFunc:any = func
  if (event === 'click') {
    newFunc = function () {
      if(timer) clearTimeout(timer);
      timer = setTimeout( ()=> {
        // @ts-ignore;
        func.apply(this, arguments)
        timer = 0;
      }, 500)
    }
  }
    on.call(this, event, newFunc);
}