Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

288
Vistas
The action 'NAVIGATE' with payload {"name":"CoursesPlaylistScreen"} was not handled by any navigator in React native

I have tried nesting the naviagtors so I don't have to face this issue but still I am getting this error as I have main navigator which is contains the first screen BootcampWeeksScreen.js then I can easily navigating through it new screen which contains const tab= createMaterialTopTabNavigator().

BootcampWeeksScreen.js:

import React from "react";
import { NavigationContainer } from "@react-navigation/native";
import { createMaterialTopTabNavigator } from "@react-navigation/material-top-tabs";
import Courses from "./BootcampAdditionalScreens/Courses";
import Tests from "./BootcampAdditionalScreens/Test";
import Roadmap from "./BootcampAdditionalScreens/Roadmap";
import CoursesPlaylistScreen from "../screens/BootcampAdditionalScreens/CoursesPlaylistScreen.js";
import { createStackNavigator } from '@react-navigation/stack';

const Stack = createStackNavigator();
const Tab = createMaterialTopTabNavigator();
const BootcampWeeksScreen=()=>{
  return (

    <NavigationContainer>

      <Tab.Navigator tabBarOptions={{ scrollEnabled: true }}>
      <Tab.Screen name="Course" component={Courses} />
      <Tab.Screen name="Tests" component={Tests} />
        <Tab.Screen name="Roadmap" component={Roadmap} />
      </Tab.Navigator>
    </NavigationContainer>
  );
}
 function App() {
    return (
      <NavigationContainer>
        <Stack.Navigator screenOptions={{ headerShown: false }}>
          <Stack.Screen name="BootcampWeeksScreen" component={BootcampWeeksScreen} />
          <Stack.Screen name="CoursesPlaylistScreen" component={CoursesPlaylistScreen} />
        </Stack.Navigator>
      </NavigationContainer>
    );
  }

  export default BootcampWeeksScreen;
  

Now I want to navigate through the screen CoursesPlaylistScreen from the Course screen but I am getting this error and also I have tried nesting the navigators.

I have tried this also to navigate though the screen: ```onPress={() =>navigation.navigate("BootcampStack",{screen:"CoursesPlaylistScreen"})} ````

Still, I am getting this error.

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

Do you have a screen named 'CoursesPlaylistScreen'?

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.

I don't know How can I do this?

about 4 years ago · Juan Pablo Isaza
2 Respuestas
Responde la pregunta

0

You can only have one NavigationContainer. Try removing NavigationContainer from BootcampWeeksScreen.

about 4 years ago · Juan Pablo Isaza Denunciar

0

The NavigationContainer is responsible for managing your app state and linking your top-level navigator to the app environment. By giving two navigators, you're resetting the whole navigator and hence unable to find the other stack.

You should only wrap your stacks in NavigationContainer on the root/top level of your navigation, i.e. function App in your situation.

about 4 years ago · Juan Pablo Isaza Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda