React Navigation:从嵌套的堆栈导航器中隐藏标签栏

时间:2021-07-16 20:58:02

标签: react-native tabbar react-navigation-v5

我想知道如何从嵌套堆栈中隐藏标签栏。我尝试了以下解决方案:

const getTabBarVisibility = (route) => {
    console.log(route);
    const routeName = getFocusedRouteNameFromRoute(route) ?? "";
    if (routeName === routes.CHAT || routeName === routes.COMMENTS)
        return false;
    return true;
};

还有这个:

    React.useLayoutEffect(() => {
    const routeName =
        getFocusedRouteNameFromRoute(route) ?? routes.POST_DETAILS;
    if (routeName === routes.COMMENTS || routeName === routes.CHAT) {
        navigation.setOptions({ tabBarVisible: false });
    } else {
        navigation.setOptions({ tabBarVisible: true });
    }
}, [navigation, route]);

但是当我在 TabNavigator 中的另一个内部有一个堆栈导航器时,它们不起作用。我还检查了文档并阅读了我应该重新组织导航的信息。但我不知道怎么做。

这是我组织导航的方式

Drawer 

     TabBar :

         FeedNav

             PostsNav

                 PostDetailsScreen

                 commentScreen (Problem here)

                 MessagesScreen (Problem here)

            commentScreen
   
        InboxNav

            MessagesScreen (I can already hide it with the function above)

        and 3 other stack navs

所以基本上我想从 MessagesScreen 和 commentScreen 隐藏标签栏

0 个答案:

没有答案