DEV Community

Dmitri Pisarev 🇷🇺
Dmitri Pisarev 🇷🇺

Posted on

The most common React mistake

Have you ever ran into this warning?

Warning: Can’t perform a React state update on an unmounted component. This is a no-op, but it indicates a memory leak in your application. To fix, cancel all subscriptions and asynchronous tasks in a useEffect cleanup function.

I bet this is the most common ReactJS newbie mistake... Forgetting to clean up your effects.

Stumbled over it again and here's how I fixed it: https://github.com/dimaip/calendar/commit/c20274917feff86af859f7252b717b84936ba865

Top comments (1)

Collapse
 
nans profile image
Nans Dumortier

Heya !
I was facing the exact same issue, so I created this hook :
npmjs.com/package/use-state-if-mou...
It basically works like React's useState, but it only updates the state if the component is mounted !
I thought it's an easy and elegant solution for that issue, what do you think ?