CODEWITHSUNDEEP
react-native
Michael Ribbons
Michael Ribbons

Reputation: 1985

How to catch component unmount caused by live reload

[edit - I thought I was using Hot Reloading, but I am actually using Live Reload]

I have a native plugin that needs to do some clean up each time it is finished with. Basically I want to prevent these errors:

Calling JS function after bridge has been destroyed: RCTDeviceEventEmitter.emit(..)

componentWillUnmount() doesn't get called.

Upvotes: 25

Views: 2293

Answers (2)

Nikhil Adwani
Nikhil Adwani

Reputation: 61

You could use something like this: Error Boundary in react

Just wrap the error prone code inside the ErrorBoundary component, e.g. 

<ErrorBoundary><childComponentCausingError></ErrorBoundary>

And in the ErrorBoundary component, you could just catch the error in componentDidCatch = (error, info) => {

}

componentDidCatch() is a lifecycle method in React.

Upvotes: 1

Mariano Miani
Mariano Miani

Reputation: 180

Live reloading will restart the app and load the app back to the initial route when a file changes. ComponentWillUnmount won't be called.

When you reload, what happens behind the scenes is that the react context is getting destroyed, and a new one is being created.

That error get's thrown whenever a Native Module is trying to do work, by using the old react context.

Upvotes: 1

Related Questions