react-native - 导入文件时选项卡导航器不起作用

Question

我想创建一个底部选项卡导航器并导入 3 个类。但它不起作用。该应用程序不会引发任何错误，但无法打开。如果所有类都在同一个文件中，它工作正常。但我真的需要导入，因为课程非常庞大。每个单独的班级都在完美地工作。

我的代码：

import React, {Component} from 'react'
import {createBottomTabNavigator,createAppContainer} from 'react-navigation'
import FriendScreen from './screens/FriendScreen'
import InstructionsScreen from './screens/InstructionsScreen'
import ItemsScreen from './screens/ItemsScreen'
const TabNavigator=createBottomTabNavigator({Game:FriendScreen,Instructions:InstructionsScreen,Items:ItemsScreen},{initialRouteName:"Game"})
export default createAppContainer(TabNavigator)

我在互联网上阅读了许多代码段，但找不到错误

标签： react-nativereact-navigation

Answer 1

错误是您没有遵循react-navigation.

定义屏幕时应该是这样的：

RouteName:{
    screen:Component.
}

您的 TabNavigator 应该是：

const TabNavigator=createBottomTabNavigator({
    Game: { 
        screen : FriendScreen 
    },
    Instructions: { 
        screen : InstructionsScreen
    },
    Items:{ 
        screen : ItemsScreen
    }
},
{
    initialRouteName:"Game"
})