I’ve spent tons of hours trying to understand how the React Hook useEffect works and how I can avoid memory leaks.
At this point, my best guess is that it’s a bug.
Related issues:
- setState hook inside useEffect can cause unavoidable warning Can’t perform a React state update #14369
- setState in useEffect causing a “React state update on an unmounted component” warning #15057
In my case, I created a custom Hook that interfaces with the GraphQL endpoint and pulls data with useEffect. It uses the useReducer Hook to update state and returns that state.
The “main” component pulls in this state by using the custom useEffect Hook.
- Custom Hook useFetchMarketData.js
- Component that uses the Hook Marketpage.js