diff --git a/packages/core/onClickOutside/index.ts b/packages/core/onClickOutside/index.ts index 2e329a0e6a1..bf8933eb311 100644 --- a/packages/core/onClickOutside/index.ts +++ b/packages/core/onClickOutside/index.ts @@ -1,5 +1,4 @@ import type { Fn } from '@vueuse/shared' -import { ref } from 'vue-demi' import type { MaybeElementRef } from '../unrefElement' import { unrefElement } from '../unrefElement' import { useEventListener } from '../useEventListener' @@ -43,7 +42,7 @@ export function onClickOutside( if (!window) return - const shouldListen = ref(true) + let shouldListen = true let fallback: number @@ -52,9 +51,14 @@ export function onClickOutside( const el = unrefElement(target) - if (!el || el === event.target || event.composedPath().includes(el) || !shouldListen.value) + if (!el || el === event.target || event.composedPath().includes(el)) return + if (!shouldListen) { + shouldListen = true + return + } + handler(event) } @@ -69,7 +73,8 @@ export function onClickOutside( useEventListener(window, 'click', listener, { passive: true, capture }), useEventListener(window, 'pointerdown', (e) => { const el = unrefElement(target) - shouldListen.value = !!el && !e.composedPath().includes(el) && !shouldIgnore(e) + if (el) + shouldListen = !e.composedPath().includes(el) && !shouldIgnore(e) }, { passive: true }), useEventListener(window, 'pointerup', (e) => { if (e.button === 0) {