useIntersectionObserver

Registers an IntersectionObserver on ref and executes callback when the observed element intersects with the root element.

• @param ref - A RefObject of the element to observe.
• @param callback - A function to execute when the observed element intersection changes.
• @param options - Configurable options
• @returns void

Example

const ref = useRef<HTMLSpanElement>(null);
const [shouldLoadImage, setShouldLoadImage] = useState(false);
 
useIntersectionObserver(ref, (entry) => {
  setShouldLoadImage(entry.isIntersecting);
}, { once: true })