React Native 中的场景名称问题

问题描述 投票:0回答:0

评论我正在构建一个应用程序,我正在使用 expo 和 react native 以及导航依赖项, 我有几个场景给我同样的错误,但我不知道为什么,但是当我加载选项卡时它加载正常。 场景被调制在一个文件中,我马上让你知道

export { default as Actividades } from './Activities/index';
export { default as Detalles } from './DetailsActivities/index';
export { default as Inicio } from './Welcome/index';
export { default as Mostrar } from './See/index';
export { default as Agenda} from './Schedule/index';
export { default as DetalleAgenda} from './DetailsSchedule/index';
export { default as APersona} from './AddPersons/index';
export { default as ADireccion} from './AddAdress/index';
export { default as AFoto} from './AddPhoto/index';

在导航文件夹中我有 4 个堆栈和 1 个选项卡,我显示其中一个的代码和选项卡

堆栈开始

import  {Inicio, Mostrar} from '../../screens/index';

import React from 'react';
import { createNativeStackNavigator } from "@react-navigation/native-stack";

const Stack = createNativeStackNavigator();

const StartNavigator = () => {
  return(
    <Stack.Navigator initialRouteName = 'Inicio'>
      <Stack.Screen name='Inicio'  component={Inicio} option={{ title:'Bienvenido'}}/>
      <Stack.Screen name ='Mostrar' component={Mostrar} option={{title: 'Actividades'}}/>
    </Stack.Navigator>
  )
}

export default StartNavigator;

标签

import ActivityNavigator from './stack/activity';
import AddNavigator from './stack/add';
import Color from '../constants/color';
import Ionicons from '@expo/vector-icons/Ionicons';
import React from 'react';
import ScheduleNavigator from './stack/schedule';
import StartNavigation from './stack/start';
import { createBottomTabNavigator } from '@react-navigation/bottom-tabs';

const BottomTab = createBottomTabNavigator();

const TabsNavigation = () => {
  return(
    <BottomTab.Navigator
      initialRouteName="StartTab"
      screenOptions={{
        headerShown: false,
        tabBarLabelStyle: {
          fontFamily: 'Montserrat-Regular',
          fontSize: 12,
        },
        tabBarActiveTintColor: Color.primary,
        tabBarInactiveTintColor: Color.gray,
    }}>

      <BottomTab.Screen
        name="StartTab"
        component={StartNavigation}
        options={{
          tabBarIcon: () => (
            <Ionicons name="home-outline" size={22} color={Color.primary} />
          ),
        }}
      />


      <BottomTab.Screen
        name="AddTab"
        component={AddNavigator}
        options={{
          tabBarIcon: () => (
            <Ionicons name="person-add" size={22} color={Color.primary} />
          ),
        }}
      />


      <BottomTab.Screen
        name="ScheduleTab"
        component={ScheduleNavigator}
        options={{
          tabBarIcon: () => (
            <Ionicons name="book-outline" size={22} color={Color.primary} />
          ),
        }}
      />

      <BottomTab.Screen
        name="ActivityTab"
        component={ActivityNavigator}
        options={{
          tabBarIcon: () => (
            <Ionicons name="checkmark-done-outline" size={22} color={Color.primary} />
          ),
        }}
      />





    </BottomTab.Navigator>
  );
};

export default TabsNavigation;

我看到的错误,它现在写了

 The action 'NAVIGATE' with payload {"name":"Mostrar"} was not handled by any navigator.

Do you have a screen named 'Mostrar'?

If you're trying to navigate to a screen in a nested navigator, see https://reactnavigation.org/docs/nesting-navigators#navigating-to-a-screen-in-a-nested-navigator.

如果你能告诉我如何解决它,我将不胜感激 谢谢

reactjs react-native expo react-navigation
© www.soinside.com 2019 - 2024. All rights reserved.