使用嵌套导航器时，屏幕未显示

问题描述

我希望选项卡导航器中有4个屏幕，而堆栈导航器中只有主页选项卡的登录和注册屏幕，因此我想使用嵌套导航器，但堆栈导航器中却嵌套了选项卡导航器，但是当我运行时该软件，屏幕显示为白色，如下所示：

我写的确切代码如下：

import React from 'react';
import 'react-native-gesture-handler';
import {StatusBar} from 'react-native';
import {NavigationContainer,DarkTheme} from '@react-navigation/native';
import {createStackNavigator} from '@react-navigation/stack';
import {createMaterialBottomTabNavigator} from '@react-navigation/material-bottom-tabs';
import MaterialCommunityIcons from 'react-native-vector-icons/MaterialIcons';

import Home from '../screens/Home';
import Search from '../screens/Search';
import Library from '../screens/Library';
import ProfileAuthor from '../screens/ProffileAuthor';
import Shoot from '../screens/Shoot';
import LoginScreen from '../screens/LoginScreen';
import SignUp from '../screens/SignUp';

const Stack = createStackNavigator();
const Tab = createMaterialBottomTabNavigator();

function myTabs() {
  return (
    <Tab.Navigator
      initialRouteName="Home"
      activeColor="#000"
      inactiveColor="#000"
      barStyle={{
        backgroundColor: '#FFF',}}>
      <Tab.Screen
        name="Home"
        component={Home}
        options={{
          title: 'Home',tabBarLabel: 'Home',tabBarIcon: ({color}) => (
            <MaterialCommunityIcons color={color} name="home" size={26} />
          ),}}
      />
      <Tab.Screen
        name="Search"
        component={Search}
        options={{
          title: 'Search',tabBarLabel: 'Search',tabBarIcon: ({color}) => (
            <MaterialCommunityIcons color={color} name="search" size={26} />
          ),}}
      />
      <Tab.Screen
        name="Upload"
        component={Shoot}
        options={{
          title: 'Upload',tabBarLabel: 'Upload',tabBarIcon: ({color}) => (
            <MaterialCommunityIcons color={color} name="add-box" size={26} />
          ),}}
      />
      <Tab.Screen
        name="Library"
        component={Library}
        options={{
          title: 'Library',tabBarLabel: 'Library',tabBarIcon: ({color}) => (
            <MaterialCommunityIcons
              color={color}
              name="person-outline"
              size={26}
            />
          ),}}
      />
    </Tab.Navigator>
  );
}

const Routes = () => {
  return (
  
      <NavigationContainer theme={DarkTheme}>
        <Stack.Screen
          name="login"
          component={LoginScreen}
          options={{
            header: () => null,}}
        />
        <Stack.Screen
          name="signup"
          component={SignUp}
          options={{
            header: () => null,}}
        />
        <Stack.Screen
          name="Home"
          component={myTabs}
          options={{
            header: () => null,}}
        />
        <Stack.Screen
          name="Video"
          component={ProfileAuthor}
          options={{
            header: () => null,}}
        />
      </NavigationContainer>
   
  );
};


export default Routes;

有人可以告诉我哪里出了问题吗？任何帮助都会很棒，谢谢。

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）