Question

React Native 导航 TypeError：未定义不是对象（评估‘Object.keys（routeConfigs）’）

2020-03-15

9872

react-native react-navigation

我在 App.js 文件中有以下代码：-

import React, { Component } from 'react';
import { Platform, StyleSheet, Text, View } from 'react-native';
import { createAppContainer } from 'react-navigation';
import { createStackNavigator } from 'react-navigation-stack';
import { NavigationContainer} from "react-navigation";


const Home = ({ navigation }) => {
  return (
      <View>
        <Text>This is Home page!</Text>
      </View>
  )
}

const Stack = createStackNavigator();

function MyStack() {
  return (
      <Stack.Navigator>
        <Stack.Screen name="Home" component={Home} />
      </Stack.Navigator>
  );
}
 export default function App() {
   return (
       <NavigationContainer>
         <MyStack />
       </NavigationContainer>
   );
}

我按照此页面上的相同说明进行操作：- https://reactnavigation.org/docs/stack-navigator/ 但它给出了一个错误

Answer 1

我按照版本 4 文档修复了这个问题问题是当我按照以下命令安装 react-navigation 包时：-

yarn add @react-navigation/native

我默认如果我安装任何包而不定义特定版本，它应该安装该包的最新当前版本（v5）默认情况下我遵循版本 5 的包文档。当我检查已安装的软件包版本时，我注意到安装的是版本 4 而不是 5 。

现在我使用了版本 4 堆栈创建语法：-

const navigator = createStackNavigator({
    Home:Home,
},
    {
        initialRouteName: 'Home'
    });
export default createAppContainer(navigator);

现在一切正常

这是

V5 https://reactnavigation.org/docs/hello-react-navigation

V4 https://reactnavigation.org/docs/4.x/getting-started

的 URL

Answer 2

尝试导入 createStacknavigator ，如下所示：

import {createStacknavigator} from '@react-navigation/stack';

这对我来说很快就有用了。

Answer 3

从以下位置导入导航器文件；

import { NavigationContainer } from '@react-navigation/native';
import { createStackNavigator } from '@react-navigation/stack';