React-native: Warning: isMounted(...) is deprecated when use NativeMethodsMixin

Created on 18 Apr 2018  路  8Comments  路  Source: facebook/react-native

Environment

OS: macOS High Sierra 10.13.4
Node: 9.4.0
Yarn: 1.3.2
npm: 5.6.0
Watchman: 4.7.0
Xcode: Xcode 9.2 Build version 9C40b
Android Studio: 2.3 AI-162.4069837

Packages: (wanted => installed)
react: 16.3.1 => 16.3.1
react-native: 0.55.1 => 0.55.1

Steps to Reproduce

Use the following in your React Native code.

rendered element:
<View ref={e => this.renderedElement = e}>

import NativeMethodsMixin from 'NativeMethodsMixin';

NativeMethodsMixin.measureInWindow.call(this.renderedElement, (x, y, width, height) => {
        this.setState({ xOffset: x, yOffset: y, elementWidth: width, elementHeight: height });
      });

Expected Behavior

Get layout information from referenced component without warnings.

Actual Behavior

It is throwing the following warning.

Warning: isMounted(...) is deprecated in plain JavaScript React classes. Instead, make sure to clean up subscriptions and pending requests in componentWillUnmount to prevent memory leaks.
Locked

Most helpful comment

"react": "16.3.1",
"react-native": "0.55.3",

I found isMounted is called
node_modules/react-native/Libraries/Components/Touchable/TouchableHighlight.js

As I used TouchableOpacity as button in my apps

All 8 comments

had the same issue when used ref.measure for a view wrapping another component inside itself... would appreciate if someone could help though it can be done with onLayout as well

@FredyC that seems to be only hiding the warning not solving it!

Well, that was the intention 馃ぁ Obviously, the isMounted is totally legacy API coming from the age of React.createClass. Also if you actually read release notes, you will understand why my solution is a correct one...

image

Duplicate of #18868

(Although this issue has a bit more info, that one was filed first- so let's consolidate the error reporting there)

"react": "16.3.1",
"react-native": "0.55.3",

I found isMounted is called
node_modules/react-native/Libraries/Components/Touchable/TouchableHighlight.js

As I used TouchableOpacity as button in my apps

Should be fixed in 0.57.

I just upgraded a whole application to 0.57.3, this warning has gone.

In my case, it did not have any incidence on my previous version of the application.

Was this page helpful?
0 / 5 - 0 ratings