useIntersectionObserver

useIntersectionObserver<T>(options?): UseIntersectionObserverReturn<T>

Defined in: src/hooks/useIntersectionObserver/useIntersectionObserver.ts:28

Observe whether an element intersects a root (defaults to the viewport). Returns a ref callback to attach to the observed element plus the latest IntersectionObserverEntry. SSR-safe: returns a no-op ref and null entry when IntersectionObserver is unavailable.

Type Parameters

T

T extends Element = Element

Parameters

options?

UseIntersectionObserverOptions = {}

Returns

UseIntersectionObserverReturn<T>

Example

const { ref, isIntersecting } = useIntersectionObserver<HTMLDivElement>({
  rootMargin: '200px',
});
useEffect(() => {
  if (isIntersecting) loadMore();
}, [isIntersecting]);
return <div ref={ref} />;