从嵌套导航器中隐藏 parent 的导航 header

Question

我正在开发我的第一个 React 本机应用程序。我对应用程序中的嵌套导航有疑问。

我有以下导航：

• 主应用程序导航器：createStackNavigator
  • 身份验证导航器：createStackNavigator
  • 底部栏导航器：createBottomTabNavigator
    • 顶部选项卡导航器：createMaterialTopTabNavigator
      • 我的导航器太嵌套了：createStackNavigator

我想要什么？

• 我试图隐藏 BottomBar 和 TopTab 导航器 headers 在最后 嵌套导航器。

我做了什么？

• 我试图在我的嵌套导航中将 header 设置为 null，但这隐藏了嵌套的 header 而不是 parents header。
• 我还尝试将 parents header 设置为空值，但那是在所有屏幕上隐藏它们。

我只需要将它们隐藏在这个嵌套屏幕中。我可以从嵌套的 React Class 中更改 parents headers 属性 吗？

Answer 1

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

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

我直接在主导航器中声明了我的嵌套导航器。 "in the same level as Authentication & Bottom Bar Navigations" 并将此特定导航的 header 设置为 null。

然后，随时导航到嵌套的那个。

此外，我必须添加自定义图标才能将用户导航回来。因为在我们的例子中，新导航器中没有历史记录，无法导航回。

所以，我是这样的：

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

});

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