如何使用 React Navigation Drawer 切换屏幕

Question

我有以下导航结构：

• App Navigator（切换导航器）
  • 授权屏幕（堆栈导航器）
  • 主页（标签导航器）
    • 供稿
    • 其他
    • 配置文件（包含抽屉）
  • 设置、法律信息等

示例抽屉内容

• 设置（导航到选项卡导航器屏幕外）
• 通知和声音

如何通过抽屉添加标签并导航至 'Settings, Legal info'？ 额外：'Profile' 标签不应显示在抽屉上。

一个类似的例子是个人资料选项卡中的 Instagram 抽屉。当您选择一个选项时，它会推送一个新屏幕。

提前致谢。

Answer 1

我想出了笨拙但可行的解决方案。

抽屉导航路线

`...
// To hide a specific route (Profile)
HiddenLabel:{
    screen:ScreenA,
    navOptions:{
        drawerLabel:()=>null
    }
}
A:{
    screen:()=>null
    navOptions:{
        drawerLabel:'Settings'
    }
}
...`

抽屉导航自定义组件

`
...
contentComponent:(props)=>(
    // Should be wrapped in SafeAreaView
    <DrawerItems {...props} onItemPress={
        ({route})=>{
            // query and use props.navigation to navigate to route.routeName
        }
    }/>
)
...
`

差不多就这些了。如果您有其他解决方案，请执行 post。