如何在React本机中从子组件导航到父组件
如何在React本机中从子组件导航到父组件
提问于 2022-04-25 10:13:11
我有多个嵌套在一起的导航(堆栈和BottomTab)，我希望从导航器的子节点导航到顶部；请考虑以下示例：
import { NavigationContainer } from "@react-navigation/native";
import { createNativeStackNavigator } from "@react-navigation/native-stack";
function AuthNav() {
const Stack = createNativeStackNavigator();
return (
<NavigationContainer independent={true}>
<Stack.Navigator>
<Stack.Screen
name="Signup"
component={Signup}
options={{ headerShown: false }}
/>
<Stack.Screen
name="Login"
component={Login}
options={{ headerShown: false }}
/>
</Stack.Navigator>
</NavigationContainer>
);
}
function App() {
return (
<NavigationContainer>
<Stack.Navigator>
<Stack.Screen
name="Auth"
component={AuthNav}
options={{ headerShown: false }}
/>
<Stack.Screen name="Feed" component={Home} />
</Stack.Navigator>
</NavigationContainer>
);
}假设我想从我的Signup屏幕移回应用程序，然后导航到Home组件，我将如何做到这一点，以及如何解释{独立自主:真}选项是如何工作的，也将受到赞赏。
回答 2
Stack Overflow用户
发布于 2022-04-25 14:20:28
正如前面的答复和评论中提到的，您正在使用NavigationContainer两次。你不能那样做。如果要导航回父屏幕，可以使用navigation.goBack()。
Stack Overflow用户
发布于 2022-04-25 10:29:02
您正在使用错误的格式编写代码。
用这个，
import { NavigationContainer } from "@react-navigation/native";
import { createNativeStackNavigator } from "@react-navigation/native-stack";
function AuthNav() {
const Stack = createNativeStackNavigator();
return (
<Stack.Navigator>
<Stack.Screen
name="Signup"
component={Signup}
options={{ headerShown: false }}
/>
<Stack.Screen
name="Login"
component={Login}
options={{ headerShown: false }}
/>
</Stack.Navigator>
);
}
function App() {
return (
<NavigationContainer>
<Stack.Navigator>
<Stack.Screen
name="Auth"
component={AuthNav}
options={{ headerShown: false }}
/>
<Stack.Screen name="Feed" component={Home} />
</Stack.Navigator>
</NavigationContainer>
);
}我希望它能解决你的问题。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/71997884
复制相关文章
相似问题
腾讯云开发者
