DEV Community

Discussion on: React useEffect cleanup: How and when to use it

Collapse
 
irfan profile image
irfan

hii here i'm not performing any async operation event though i'm still getting warnings with cleanup function when i'm routing to another page. Please can you suggest me any solution.

export default function useOnScreen(ref, rootMargin = "0px") {
const [isVisible, setIsVisible] = useState(false)
useEffect(() => {
let setRef=null;
if (ref.current === null) return
const observer = new IntersectionObserver(
([entry]) => setIsVisible(entry.isIntersecting),
{ rootMargin }
)
observer.observe(ref.current)
setRef=ref
return () => {
if (setRef.current) {
observer.unobserve(setRef.current)
}
}
}, [ref, rootMargin])

return isVisible
}