我有一個 navigator ( X) ，它擁有一個螢屏，我們稱之為N，還有另一個 navigator ，Y. 我需要從 navigatorY中的螢屏移動N到根導航器中的螢屏。我將如何使用反應導航 6 來執行此操作？
根路由器的代碼：
<NavigationContainer>
<Tabs.Navigator>
<Tabs.Screen component={HomeRouter} name="HomeTab" />
</Tabs.Navigator>
</NavigationContainer>
家庭路由器（導航器X）的代碼：
<NavigationContainer independent={true}>
<Stack.Navigator initialRouteName={"Home"}>
<Stack.Screen name="Home" component={Home} />
<Stack.Screen name="Post" component={Post} />
<Stack.Screen name="Profile" component={Account} />
</Stack.Navigator>
</NavigationContainer>
組態檔路由器（導航器Y）的代碼：
<NavigationContainer independent={true} theme={MyTheme}>
<Stack.Navigator>
<Stack.Screen name="MainProfile" component={MainAccountPage} />
</Stack.Navigator>
</NavigationContainer>
我需要從MainAccountPage螢屏導航navigator Y到Post.navigator X
uj5u.com熱心網友回復：
首先，所有嵌套導航器都應該有一個NavigationContainer，這意味著Y導航器應該是這樣的：
<Stack.Navigator>
<Stack.Screen name="MainProfile" component={MainAccountPage} />
</Stack.Navigator>
之后，asMainAccountPage用作螢屏，您navigation從props. 您可以通過這種方式導航（將行放在您需要的位置）：
export default function MainAccountPage({navigation}){
navigation.navigate("Post"); // how you navigate
return <></>
}
這是一個總體概述。假設我們有那些嵌套的導航器：
function Home() {
return (
<Tab.Navigator>
<Tab.Screen name="Feed" component={Feed} />
<Tab.Screen name="Messages" component={Messages} />
</Tab.Navigator>
);
}
function App() {
return (
<NavigationContainer>
<Stack.Navigator>
<Stack.Screen
name="Home"
component={Home}
options={{ headerShown: false }}
/>
<Stack.Screen name="Profile" component={Profile} />
<Stack.Screen name="Settings" component={Settings} />
</Stack.Navigator>
</NavigationContainer>
);
}
如果您navigation.goBack()在嵌套螢屏中呼叫，則只有在您已經在導航器的第一個螢屏上時，它才會回傳父導航器。其他動作，例如navigate類似的作業，即導航將發生在嵌套中navigator，如果嵌套導航器無法處理它，那么父導航器將嘗試處理它。
在上面的例子中，當呼叫navigate('Messages'), inside Feedscreen 時，嵌套的 tab navigator 會處理它，但是如果你呼叫navigate('Settings')，父 stack navigator 會處理它。
轉載請註明出處，本文鏈接：https://www.uj5u.com/qukuanlian/434413.html