Для этого навигатора отсутствует навигационная опора. В реакции-навигации v3 и v4 вы должны настроить контейнер приложения напрямую

Question

Я пытаюсь обрисовать в общих чертах навигатор, но при получении опоры навигации отсутствует ошибка. Я добавил все необходимые пакеты, следуя инструкциям из Net Ninja, он также успешно импортировал btw import Home из './screens/home';

import 'react-native-gesture-handler';
import React, {useState} from 'react';
import * as Font from 'expo-font';
import Home from './screens/home';
import { AppLoading } from 'expo';
import Navigator from './routes/homestack';


const getFonts = () => Font.loadAsync({
    'Lacquer-regular': require('./assets/fonts/Lacquer-Regular.ttf'),
    'Roboto-bold': require('./assets/fonts/Roboto-Bold.ttf')
  });



export default function App() {
const [fontsLoaded, setFontsLoaded] = useState(false);

  if(fontsLoaded){
  return (
   <Navigator />
  );
} else {
  return (
  <AppLoading 
    startAsync={getFonts}
    onFinish={()=> setFontsLoaded(true)}
  />
  )
   }
}

Как выглядят мои маршруты Я использую V4 реагирующей навигации:

import { createStackNavigator} from 'react-navigation-stack';
import About from '../screens/about';

const screens = {
    About: {
        screen: About,
        navigationOptions: {
            title: 'About HorrorZone',
        }
    },
}

const AboutStack = createStackNavigator(screens, {
    defaultNavigationOptions: {
        headerTintColor: 'white',
        headerStyle: { backgroundColor: 'red' }
    }
});

export default AboutStack;

Как выглядит файл Homestack, если он поможет:

import { createStackNavigator} from 'react-navigation-stack';
import Home from '../screens/home';
import ReviewDetails from '../screens/reviewDetails';

const screens = {
    Homepage: {
        screen: Home,
        navigationOptions: {
            title: 'HorrorZone',
        }
    },
    ReviewDetails: {
        screen: ReviewDetails,
        navigationOptions: {
            title: 'Review Details',
        }
    } 
}

const HomeStack = createStackNavigator (screens, {
    defaultNavigationOptions: {
        headerTintColor: 'white',
        headerStyle: { backgroundColor: 'red' }
    }
});

export default HomeStack;

Это точная ошибка, которую я получаю:

Answer 1

Вы не включили свой стековый навигатор в навигатор приложений. Оберните ваш HomeStack в createAppContainer и затем экспортируйте его следующим образом:

import { createAppContainer } from 'react-navigation'; // import this
import { createStackNavigator } from 'react-navigation-stack';
import Home from '../screens/home';
import ReviewDetails from '../screens/reviewDetails';

const screens = {
  Homepage: {
    screen: Home,
    navigationOptions: {
      title: 'HorrorZone',
    }
  },
  ReviewDetails: {
    screen: ReviewDetails,
    navigationOptions: {
      title: 'Review Details',
    }
  }
}

// store stack navigator in any variable
const stack = createStackNavigator(screens, {
  defaultNavigationOptions: {
    headerTintColor: 'white',
    headerStyle: { backgroundColor: 'red' }
  }
});

// create app container 
const HomeStack = createAppContainer(stack);

export default HomeStack;

Внесены те же самые изменения в AboutStack.

Примечание: It не рекомендуется использовать appContainer более одного в вашем навигаторе. Вместо того, чтобы просто создать один маршрутизатор, который обернет ваш стековый навигатор в один appContainer.

Answer 2

Если вы используете React Navigation V3, вы должны использовать контейнер напрямую. В V3 createNavigationContainer переименован в createAppContainer .

Пример для V3

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

Если вы используете React Navigation V4, навигаторы были перемещены в отдельный репозиторий. Вам нужно будет установить и импортировать данные из «response-navigation-stack».

Пример для V4

import { createStackNavigator } from 'react-navigation-stack'

В React Navigation в различных версиях произошло много серьезных изменений. Пожалуйста, взгляните.

https://reactnavigation.org/blog/#breaking - изменения