Warning about calling setState on an unmounted component

Question

The warning:

Warning: setState(...): Can only update a mounted or mounting component. This usually means you called setState() on an unmounted component. This is a no-op. Please check the code for the _class component.

Any idea where it can come from. Gotchas or things like that ?

I already looked at all the setState in my code and replaced them to make sure. Can't find where it comes from...

My observations so far:

• Only happens in my tests
• No problem in the browser
• I thought I had more... but with more testing I got all confuse because it didn't fit the patterns I thought I understood...

So ! I understand what the error is but this time the warning is about a _class component so I'm lost... I just upgraded to react-router v4 and it needed a lot of changes so it's hard to localize the source of the warning.

Anyone had had a similar problem before ?

EDIT: I found the setState that were causing problem. It was in react-router-server. I'll look into it to see if I can fix it !

Thanks @zerkms for the idea to look with a debugger to get the line number since there was no trace in the terminal.

I used the v8 experimental inspector(https://stackoverflow.com/a/39901169/3687661). Works pretty good :)

Answer 1

This is common due to async activities like API calls. For example, this happen when you try to set a state after you receive the data from the server and the corresponding page to receive that state is not mounted.

To avoid this, check if the component is mounted before setting state in that component. Use a flag to check, say this.mounted = true in componentDidMount and change the flag to false in componentWillUnmount. Use this.mounted across the component to check if the component is mounted. This will fix the warning.

Hope this helps!

Answer 2

This usually happens when you call this.setState within a setTimeout or setInterval or some other deferred function.

If you are using setTimeout/setInterval make sure you call clearTimeout/clearInterval in componentWillUnmount.