react-native: null is not an object (evaluating 'this._component.getScrollableNode')

In my case what haikyuu said solved it. A had component that used ART in the background (a spinner), written stateless.

const Whatever = (props) => { // ..... bla bla

I changed it to a normal component: class Whatever extends React.Component { // ..... bla bla

and I never saw the error ever since.

I think the issue comes from Animated trying to attach ref to a stateless component. And stateless components cannot have refs.

Using class to create the component does fix the issue.

Here is a react-native project to reproduce it.

This was also asked in stackoverflow

Hopefully this helps someone!

I narrowed it down in my app to react-navigation

When null’ing out the route stack and pushing a new route (without a stack in between or resetting correctly) it will throw this when you hit the back button. Here’s the change I made:

Still exists.

"react": "16.0.0-alpha.12",
"react-native": "0.47.1",

EDIT: I have made a custom Card element, simple file nothing fancy (40 lines) and this error occurs when import it in some other JS file. Funny part is that It doesn’t occur when importing but occurs when that component is used.

import { Card } from './Card';

No error ^

<Card>
</Card>

error.

I am not using any Animation.

Edit 2: Solved it:

how?

I was doing export default Card (my bad) changing it to export {Card} fixed it.

Hope it helps someone.

@yelongfei2008 I monkey patched my local react native codebase to guard against this._component being null in this._detachNativeEvents and this._attachNativeEvents. Works fine now, but looking forward to a proper solution to this.

I’ve ran into this a few times before reading @haikyuu comment. The exact issue I was seeing involves TouchableHighlight (possibly also TouchableOpacity). I got this error when using a Component class, a stateless functional component, and a Text component as a child. Simple fix:

<TouchableHighlight>
  <MyComponent/>
</TouchableHighlight>

change to:

<TouchableHighlight>
  <View>
    <MyComponent/>
  </View>
</TouchableHighlight>

I had this problem because the child of TouchableHighlight was no a View but a Text. Making a View the direct child of TouchableHighlight solved my problem

These are my dependencies

“react”: “16.0.0-alpha.3”, “react-native”: “0.43.2”,

I’m getting this error as well, only seems to be happening on Android for me, and I’ve seen it happen on Android 4.4.2, 6.0 and 7.0.

I’m using ART for a component in my app also, but my component that uses ART is already a normal component (extends React.Component). Not sure if maybe one of its child components is a stateless component and that’s causing the issue, like @SudoPlz suggests? Also not sure if this error really gets triggered by anything relating to this component that uses ART.

My dependencies are:

"react": "~15.4.0",
"react-native": "0.41.2",

My app is suffering from this, but only when I deploy through iTunesConnect / TestFlight. So far I’ve not been able to reproduce in dev mode. And it doesn’t happen consistently unfortunately.

I’ve searched my codebase for both componentWillUpdate and componentWillReceiveProps and they don’t appear. Sorry I can’t be of more help