React' findNodeHandle method stopped working
19,764
Solution 1
Now the function may be used without object:
import {
...
findNodeHandle,
...
} from 'react-native';
And call it directly:
findNodeHandle(this.refs[refName])
Solution 2
You have to import ReactNative as well.
import ReactNative from 'react-native';
...
ReactNative.findNodeHandle(...)
Solution 3
import {
...
findNodeHandle,
} from 'react-native';
var RCTUIManager = require('NativeModules').UIManager;
var view = this.refs['yourRef']; // Where view is a ref obtained through <View ref='ref'/>
RCTUIManager.measure(findNodeHandle(view), (fx, fy, width, height, px, py) => {
console.log('Component width is: ' + width)
console.log('Component height is: ' + height)
console.log('X offset to frame: ' + fx)
console.log('Y offset to frame: ' + fy)
console.log('X offset to page: ' + px)
console.log('Y offset to page: ' + py)
})
Author by
Ivan Chernykh
JavaScript/ReactNative/React, Firebase/Google Cloud. Also Express/Node, Expo, Ruby on Rails, CI/CD, PHP, Angular/Ionic, HTML5/CSS3, AS3/Starling/Box2D, XML/XSL/XSD, Webpack, Git, Grunt, Gulp, Sass, Cordova, PhoneGap, jQuery, Unix/ShellJS. Still love Macromedia Flash! CTO at https://tryriplewhale.com Creator of "Rock Paper Scissors Puzzle":
Updated on June 04, 2022Comments
-
Ivan Chernykh almost 2 years
After upgrade to 0.26.0-rc version, this line:
React.findNodeHandle(this.refs.myRef)
Throws this error message:
Unhandled JS Exception: _react2.default.findNodeHandle is not a function.
I'm importing React with this:
import React from 'react';
Docs still say: "As always, to obtain a native node handle for a component, you can use React.findNodeHandle(component)."