Реактивная навигация стека навигатора не работает

Question

Я использовал stackNavigator 2 в одном из моих проектов следующим образом.import {StackNavigator} из "act-navigation ";

import {
   LoginScreen,
   TechStackScreen
} from '../screens';

// Public routes
export const PublicRoutes = StackNavigator({
   login: { screen: LoginScreen}
});

// Secured routes
export const SecuredRoutes = StackNavigator({
   techStack: { screen: TechStackScreen}
});

Но когда я попытался использовать его с версией 3+, это не сработало.Может кто-нибудь дать мне пример кода, как использовать stacknavigation 3+, как это?

Answer 1

Вам нужно использовать createAppContainer на вашем корневом навигаторе.Это было ломающее изменение, введенное в v3

Также StackNavigator было заменено на createStackNavigator

Вот простой пример использования.

App.js

import React, {Component} from 'react';
import AppContainer from './MainNavigation';
export default class App extends React.Component {
  render() {
    return (
      <AppContainer />
    )
  }
}

MainNavigation.js

import Screen1 from './Screen1';
import Screen2 from './Screen2';
import { createStackNavigator, createAppContainer } from 'react-navigation';

const screens = {
  Screen1: {
    screen: Screen1
  },
  Screen2: {
    screen: Screen2
  }
}

const config = {
  headerMode: 'none',
  initialRouteName: 'Screen1'
}

const MainNavigator = createStackNavigator(screens,config);
export default createAppContainer(MainNavigator);

Answer 2

Вы должны импортировать и использовать createStackNavigator, вот документы https://reactnavigation.org/docs/en/stack-navigator.html

Просто нужно внести небольшие изменения в ваш код

// Public routes
export const PublicRoutes = createStackNavigator({
   login: { screen: LoginScreen}
});

// Secured routes
export const SecuredRoutes = createStackNavigator({
   techStack: { screen: TechStackScreen}
});