R
fn

useIntersectionObserver

v0.0.15testeddemo

Detect when an element enters or leaves the viewport via `IntersectionObserver`. Accepts a single target, an array of targets, or a ref/getter resolving to either, plus reactive `rootMargin` and `threshold`.

Example

ts
useIntersectionObserver(el, ([{ isIntersecting }]) => {
  visible.value = isIntersecting;
});

Demo

Loading demo…

Signature

ts
export function useIntersectionObserver(
  target: MaybeComputedElementRef | MaybeComputedElementRef[] | MaybeRefOrGetter<MaybeElement[]>,
  callback: IntersectionObserverCallback,
  options: UseIntersectionObserverOptions ={ ... }

Parameters

ParameterTypeDescription
targetanyElement(s) to observe
callbackIntersectionObserverCallbackInvoked with the observer entries
options?UseIntersectionObserverOptionsOptions

Returns

UseIntersectionObserverReturnObserver controls