Rev 2774 | AutorÃa | Comparar con el anterior | Ultima modificación | Ver Log |
import { useState, useEffect, useRef } from 'react';
export function useNearScreen({ once = true, rootMargin = '100px' }) {
const [isNearScreen, setShow] = useState(false);
const fromRef = useRef(null);
useEffect(() => {
const onChange = (entries, observer) => {
const el = entries[0];
if (el.isIntersecting) {
setShow(true);
once && observer.disconnect();
} else {
!once && setShow(false);
}
};
const observer = new IntersectionObserver(onChange, {
rootMargin
});
if (fromRef.current) observer.observe(fromRef.current);
return () => observer && observer.disconnect();
}, [fromRef]);
return [isNearScreen, fromRef];
}