Search code examples
reactjsreact-nativemobilecomponentsnavigator

Invariant Violation: Element type is invalid (error when i use Navigator tag)

i'm facing this issue when i tried to run the example code about Navigator tag from React-Native docs.

This is my App.js file:

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

export default class App extends Component {
  render() {
    return (
      <Navigator 
      initialRoute={{title: 'Awesome Scene', index: 0}}
      renderScene={(route, navigator) => <Text>Hello {route.title}!</Text>}
      />
    )
  }
}

And this is my index.js file: 

/**
 * @format
 */

import {AppRegistry} from 'react-native';
import App from './App';
import {name as appName} from './app.json';

AppRegistry.registerComponent(appName, () => App);

And this is the problem:

enter image description here

Solution

  • The problem is that react-native has deprecated Navigator, so you're most likely using a version that doesn't support it, I believe version 0.46 supports it but the most recent versions do not.

    I would recommend you take a look at react navigation

    React Native 0.61 Documentation Here you can see on the left that there's no Navigator.