Invariant Violation: The navigation prop is missing for this navigator

Question

I am receiving this message when I tried starting my react native app. Usually this kind of format works on other multi screen navigation yet somehow does not work in this c

Answer 1

I had the code at the bottom

export default class App extends React.Component {
  render() {
    return (
      <View >
        <SimpleApp style={{ width: Dimensions.get("window").width }} />
      </View>
    );
  }
}

I simply replaced it with and it worked like a charm. Definitely, it's because updates in react-navigation library:

const App = createAppContainer(SimpleApp);
export default App;

Also, I included createAppContainer library into react-navigation at the top as well.

Answer 2

I wasted my 2.5 hours to got this solution after many google searches...Hope this will work.

just import this two:

import { createStackNavigator } from "react-navigation-stack";
import { createAppContainer } from "react-navigation";

and make a little change to your code like this:

create const above the class

const AppNavigator = createAppContainer(RootStack);

and finally call that const in the class instead of <RootStack/>

<AppNavigator />

Thankx!

Answer 3

@Tom Dickson something like this:

import React, { Component } from 'react';
import { createStackNavigator, createAppContainer } from 'react-navigation';

import ScreenOne from './ScreenOne';
import ScreenTwo from './ScreenTwo';

const NavStack = createStackNavigator({
    ScreenOne: { 
        screen: ScreenOne,
    },
    ScreenTwo: { 
        screen: ScreenTwo,
    },
});

const App = createAppContainer(NavStack);

export default App;

Then reference it with

<App />

Answer 4

import React, { Component } from 'react';
import { createStackNavigator, createAppContainer } from 'react-navigation';
import Home from './home';
import Details from './details';

const Root = createStackNavigator({

    home: { 

        screen: Home,
    },

    details: { 

        screen: Details,
    },

});

const container = createAppContainer(Root);
export default container;   

in your App.js file reference it with </container>