显示/隐藏导航标题,取决于react-native中的平台

时间:2019-02-27 04:12:12

标签: javascript react-native header react-navigation

我想根据react-native的平台显示/隐藏标题。我已经完成了

  const RNApp = createStackNavigator(
  {
    Menu: {
      screen: Menu,
      navigationOptions: {
        gesturesEnabled: false,
        headerBackground: (
          <Image
            style={[
              StyleSheet.absoluteFill,
              {
                width: Metrics.screenWidth * 0.5,
                height: Metrics.navBarHeight * 0.6,
                marginTop:
                  Platform.OS === "ios"
                    ? Metrics.navBarHeight * 0.45
                    : Metrics.navBarHeight * 0.2,
                marginLeft: Metrics.screenWidth * 0.25,

                resizeMode: "contain"
              }
            ]}
            source={images.icons.headerimage}
          />
        )
      }
    },
    WebViewScreen: {
      screen: WebViewScreen,
      navigationOptions: {
        headerVisible: Platform.OS === "ios" ? true : false,
        gesturesEnabled: false
      }
    }
  },
  {
    headerMode: "screen",
    initialRouteName: "Menu"
  }
);

如果平台像我想的那样是ios,这将起作用,因为没有硬件后退按钮,必须有一个标题才能向后导航。但是使用上述代码,即使在我给出的条件下,即使在android的情况下,标题仍然可见。如何解决这个问题?

1 个答案:

答案 0 :(得分:1)

没有属性wxExecute()。您要查找的属性是headerVisible

  

标题

     

React元素或给定HeaderProps的函数返回React   元素,显示为标题。设置为null会隐藏标题。

您的情况必须为:

header

另请参阅here