Search code examples
react-nativereact-native-navigationwix-react-native-navigation

Navigation: project.testscreen registration result is 'undefined'


I've just installed react-native-navigation using the installation guides provided on https://wix.github.io/react-native-navigation/#/installation-ios and the usage guide https://wix.github.io/react-native-navigation/#/usage.

I've followed these and checked out multiple example apps, but I cannot figure out why my screens won't register.

The error I receive is: console.error: "Navigation: project.testscreen registration result is 'undefined'".

The registerScreens is called and the registration is completed, but it seems like the registration results to undefined.

index.js

import App from './src/app'
const app = new App();

app.js

import { Navigation } from 'react-native-navigation';
import { registerScreens } from './screens';

registerScreens();

Navigation.startTabBasedApp({
 tabs: [{
  label: 'Test',
  screen: 'project.testscreen',
  title: 'Test',
 }]
});

screens.js

import { Navigation } from 'react-native-navigation'

import { TestScreen } from './components/testScreen'

export function registerScreens() {
    Navigation.registerComponent('project.testscreen', () => TestScreen)
}

testScreen.js

import React, { Component } from 'react';
import { Text, View } from 'react-native';

class TestScreen extends Component {

 render() {
   return (
    <View>
     <Text>Hi</Text>
    </View>
   )
  }
}

export default TestScreen

react-native: 0.55.4

react-native-navigation: latest (1.1.479)


Solution

  • change

    import { TestScreen } from './testScreen'
    

    to

    import TestScreen from './testScreen'   
    

    Because TestScreen exports as default