React Native: Invariant Violation: The navigation prop is missing for this navigator

Question

My code is as follows:

import React, {Component} from \'react\';
import {Platform, StyleSheet, Text, View} from \'react-native\';
import {LoginNavigator} fro         


        

Answer 1

This is working solution for above problem

import { createStackNavigator } from 'react-navigation-stack'
import Login from './src/Login';
import Fruits from './src/Fruits';
import FruitZoom from './src/FruitZoom';
import {createAppContainer } from 'react-navigation';
import React from 'react';

const AppNavigator = createStackNavigator({
  Login: { screen:Login},
  Fruits: { screen: Fruits},
  FruitZoom: { screen: FruitZoom}
}, {
  initialRouteName: 'Login',
  headerMode: 'none'
});

const Apps = createAppContainer(AppNavigator);
export default class App extends React.Component {
  render() {
      return <Apps />;
  }
}

Answer 2

In react-navigation v3, you must wrap makeRootNavigator with createAppContainer. Change your code to :

render() {
   const Navigator = createAppContainer(makeRootNavigator(this.state.accessToken));
   return <Navigator />
}

and don't forget to import createAppContainer on top of the file

import {createSwitchNavigator, createAppContainer} from 'react-navigation'