场景:
const Component = () => {
...
return (
<Pressable
...
onPress={() => router.push('[otherTab]/[screenWithinOtherTabStack]')}
>
...
}
...OtherTabNavigator()
return(
<Stack
...
screenOptions={{
...
headerLeft={() => (
<Pressable
onPress={() => router.back()}
...
>
...
router.back()
将导航到 [otherTab]
而不是它源自的选项卡/屏幕 推送的路由似乎丢失了路由上的任何状态。
我尝试使用
useNavigation()
从当前路径获取密钥,然后导航到 '[otherTab]/[screenWithinOtherTabStack]'
将密钥作为参数传递,但我无法使用该密钥导航回推送源自的特定屏幕路由。
如果有人对已成功处理的此类情况有任何见解,我们将不胜感激。
每个导航器都保留自己的导航历史记录嵌套导航器所以我所做的是将共享导航逻辑集中在外部导航器中。这样,您就可以轻松地从任何选项卡导航到所需的屏幕。
假设您有一个类似
(tabs)/post/[edit].tsx
的屏幕,您想从其他选项卡访问它。相反,请将其在项目结构中向上移动。现在,您可以使用像router.push(edit/${postId})
这样的统一路线导航到此屏幕,并跟踪历史记录的变化。
app
|-- (tabs)
| |-- post
| |-- comments
| |-- ...
|-- post
| |--[edit].tsx
|-- ...