vue 自定义指令之防抖动函数

vue2

  directives: {
    preventReClick: {
      // 指令的定义
      inserted: function (el,binding) {
        el.addEventListener('click', () => {
          if (!el.disabled) {
            el.disabled = true;
            setTimeout(() => {
              el.disabled = false;
            }, binding.value || 5000);
          }
        });
      }
    }
  },

vue3

const vPreventReClick= {
  mounted: (el) =>   el.addEventListener('click', () => {
          if (!el.disabled) {
            el.disabled = true;
            setTimeout(() => {
              el.disabled = false;
            }, binding.value || 5000);
          }
        });
}

调用方式

<button @click="handle" v-preventReClick>提交</button>

你可能感兴趣的:(前端,vue.js,javascript,前端)