CODEWITHSUNDEEP
javascriptandroidiosreact-native
everydayprogrammer
everydayprogrammer

Reputation: 73

How do I fix null is not an object React Native Splash Screen

I have followed the instructions from this exactly: https://www.npmjs.com/package/react-native-splash-screen As well as watching a youtube video that goes over the same steps.

My code is:

import * as React from 'react';    
import SplashScreen from 'react-native-splash-screen';
import HomePage from './src/Home';
import {navigationRef} from './RootNavigation';
import * as RootNavigation from './RootNavigation.js';

const Stack = createStackNavigator();

export default class App extends React.Component {
  componentDidMount() {
    setTimeout(1000);
    SplashScreen.hide();
  }
  render() {
    return (
      <NavigationContainer ref={navigationRef}>
        <Stack.Navigator>
          <Stack.Screen
            name="Home"
            component={HomePage}
          />
        </Stack.Navigator>
      </NavigationContainer>
    );
  }
}

The app runs exactly how it should, but only web I remove the componentDidMount method. The line where I set SplashScreen.hide(); is what is causing the error.

The error I am getting is:

TypeError: null is not an object (evaluating '_reactNativeSplashScreen.default.hide')

This error is located at:
    in App (at renderApplication.js:45)
    in RCTView (at AppContainer.js:109)
    in RCTView (at AppContainer.js:135)
    in AppContainer (at renderApplication.js:39)

componentDidMount
    App.js:47:4

I have tried doing the manual installation, making sure the react-native-splash-screen is installed and running npm install, but nothing seems to work.

Upvotes: 3

Views: 4913

Answers (2)

Hamza Murtaza
Hamza Murtaza

Reputation: 50

What I'm thinking is that you should call the SplashScreen.hide() function in the callback of your setTimeout() function. Here:

componentDidMount() {
    setTimeout(1000, () => SplashScreen.hide());
}

If this doesn't work, please try checking what value does the SplashScreen object hold.

Upvotes: 0

everydayprogrammer
everydayprogrammer

Reputation: 73

After running react-native run-ios

I found that I was manually linking react-native-splash-screen package when the version of react-native I am using supports autolinking.

After running react-native unlink react-native-splash-screen and then react-native run-ios this fixed my issue.

Upvotes: 1

Related Questions