有效负载 { "name" ： "CoursesPlaylistScreen" } 的动作"导航"未由 React 本机中的任何导航器处理

Question

我已经尝试嵌套导航器，所以我不必面对这个问题，但我仍然得到这个错误，因为我有主导航器，它包含第一个屏幕BootcampWeeksScreen.js，然后我可以很容易地导航通过它包含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;

现在我想从Course屏幕导航到CoursesPlaylistScreen屏幕，但我得到了这个错误，我也尝试嵌套导航器。

我也试过这个通过屏幕导航:' ' ' onPress={() =>navigation.navigate("BootcampStack"，{screen:"CoursesPlaylistScreen"})} ````

我仍然得到这个错误。

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.

我不知道我该怎么做?

Answer 1

你只能有一个NavigationContainer。尝试从BootcampWeeksScreen中删除NavigationContainer。

Answer 2

NavigationContainer负责管理你的应用状态，并将你的顶层导航器链接到应用环境。通过给出两个导航器，你重置了整个导航器，因此无法找到另一个堆栈。

你应该只把你的堆栈包装在导航的根/顶层的NavigationContainer中，也就是在你的情况下的function App。