re: How to fade in content as it scrolls into view VIEW POST

FULL DISCUSSION
 

Thank you for the post, @selbekk ~

For completeness, one can unobserve the ref in FadeInSection on unmount.

  React.useEffect(() => {
    const observer = new IntersectionObserver(entries => {
      entries.forEach(entry => {
        console.log(`entry`, entry, `is = ${entry.isIntersecting}`);
        setVisible(entry.isIntersecting);
      });
    });

    const { current } = domRef;
    observer.observe(current);

    //                      πŸ‘‡ 
    return () => observer.unobserve(current);
  }, []);

I wasn't aware of this unobserve until running into the issue recently when I implemented my sticky components using IntersectionObserver, which had a memory leak.

error

Here is the fork with unobserve & "unmount" button.

 

Ah that’s true - forgot about that one! I’ll update the example later today to include it (with credit given, of course)

Edit: Updated the post.

 
code of conduct - report abuse