从嵌套导航器中隐藏父级的导航标题 [英] Hide parent's navigation header from the nested navigator

问题描述

我正在开发我的第一个 React 原生应用.应用中的嵌套导航有问题.

I'm developing my first react native app. I've an issue with the nested navigations in the app.

• 主应用程序导航器:createStackNavigator
  • 身份验证导航器:createStackNavigator
  • 底部栏导航器:createBottomTabNavigator
    • 顶部标签导航器:createMaterialTopTabNavigator
      • 我的嵌套导航器:createStackNavigator
      • 我正在尝试隐藏 BottomBar &TopTab 导航器标题在最后一个嵌套导航器中形成一个屏幕.
      • I'm trying to hide the BottomBar & TopTab Navigators headers form a screen in the last nested navigator.
      • 我尝试在嵌套导航中将标题设置为 null，但这隐藏了嵌套标题而不是父标题.
      • 我还尝试将父标题设置为空值，但这会将它们从所有屏幕中隐藏起来.

      推荐答案

      不幸的是，我不知道如何在不使用 redux 的情况下做到这一点.

      Unfortunately, I didn't figure how to do that without using redux.

      所以我不得不做一个解决方法.

      So I had to do a workaround.

      我直接在主导航器中声明了我的嵌套导航器.与身份验证和底部栏导航处于同一级别"，并将此特定导航的标题设置为空.

      I declared my Nested Navigator directly in the Main Navigator. "in the same level as Authentication & Bottom Bar Navigations" and set the header as null for this specific nav.

      然后，随时导航到嵌套的位置.

      And then, navigate to that nested whenever i want.

      此外，我必须添加我的自定义图标来导航用户返回.因为在我们的例子中，新导航器中没有历史记录以便导航回.

      Also, I had to add my custom icon to navigate the user back. because in our case there is no history in the new navigator in order to navigate back to.

      所以，我喜欢这样:

      static navigationOptions = ({ navigation }) => ({
      headerLeft: (
        <Icon
          name="chevron-left"
          color="#fff"
          underlayColor="#4BA6F8"
          onPress={() => {
            const backAction = NavigationActions.back();
            navigation.dispatch(backAction);
          }}
        />
      ),
      

      });

      我知道这不是我问题的真正答案，但至少它解决了我的问题.

      I know this is not the real answer for my question, but at least it solved my issue.

      这篇关于从嵌套导航器中隐藏父级的导航标题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！