1 - Create a simple instance new IntersectionObserve()
2 - IntersectionObserve get 2 params but the first one is a callback where you need to get the entries.
3 - Entries is a array of elements which contains information about the observed elements.
4 - You need iterate each one to set the new data to show up (forEach)
5 - But first at all you need a node... so we create a new ref to get this one it'll watch to observe the DOM element
6 - Create a useEffect to put observer.observe(node.current)
7 - return useEffect hook observer.disconnect() to disconnect the observer
8 - useEffect dependencies add the state you need listen all the time to get the new data from IntersectionObserve
Add Intersection observer api
1 - Create a simple instance
new IntersectionObserve()
2 - IntersectionObserve get 2 params but the first one is a callback where you need to get theentries
. 3 -Entries
is a array of elements which contains information about the observed elements. 4 - You need iterate each one to set the new data to show up (forEach
) 5 - But first at all you need a node... so we create a newref
to get this one it'll watch to observe the DOM element 6 - Create a useEffect to putobserver.observe(node.current)
7 - return
useEffect
hookobserver.disconnect()
to disconnect the observer 8 -useEffect
dependencies add the state you need listen all the time to get the new data fromIntersectionObserve