vue 自定义防抖指令

export default {
    install(Vue) {
      Vue.directive("debounce", {
        bind: (el, binding) => {
          let debounceTime = binding.value; // 防抖时间
          if (!debounceTime) {
            debounceTime = 1000;
          }
          let timer;
          el.addEventListener(
            "click",
            (event) => {
              if (!timer) {
                cbFun = setTimeout(() => {
                  timer = null;
                }, debounceTime);
              } else {
                event && event.stopImmediatePropagation();
              }
            },
            true
          );
        },
      });
    },
  };

在main.js 中引入使用

import  debounce form './debounce' 

Vue.use(debounce)

使用指令

<button v-debounce @click='handelClick'> <button>

定义防抖时间

<button v-debounce='500' @click='handelClick'> <button>