Vue3项目自定义全局防抖节流

1. 先创建一个debounce.ts

export default {//自定义防抖操作preventReClick: {mounted(el: { addEventListener: (arg0: string, arg1: () => void) => void; disabled: boolean }, binding: { value: any }) {el.addEventListener('click', () => {if (!el.disabled) {el.disabled = truesetTimeout(() => {el.disabled = false}, binding.value || 2000) //2000ms间隔时间}})}}
}

在全局注册指令

import dir from "./composables/useDebounce";
const app = createApp(App);
app.directive('preventReClick', dir.preventReClick);

使用

<Button v-preventReClick type="submit" @click="handleLogin">登录</Button>