Question

我试图仅在我的本机应用程序的某些页面中隐藏导航标题。但我没有得到它的解决方案。我不想对这些页面使用不同的导航实验。

   class AppContainerWithCardStack extends React.Component {
     render() {
         let { navigationState, backAction } = this.props

         return (

          <NavigationCardStack
            navigationState={navigationState}
            onNavigateBack={backAction}
            style={styles.container}
            direction='vertical' 

            renderHeader={this._renderHeader}
            renderScene={this._renderScene}
        />
         )
      }
  _renderHeader(props)
  { const route = props.scene.route
    if (route.key === 'Splash') 
    return null
    else
    return <NavigationHeader
                    {...props}
                    onNavigateBack={props.scene.index > 1 ? backAction : undefined}
                    renderTitleComponent={props => {
                        const title = props.scene.route.title
                        return <NavigationHeader.Title>{title}</NavigationHeader.Title>
                    }}/>

  }

Answer 1

我们使用此代码隐藏了我们的简介第一个屏幕中的导航标题（为了便于阅读而减少）：

import { NavigationExperimental } from 'react-native'
const { CardStack, Header } = NavigationExperimental

class IntroContainer extends Component {
    render() {
        return <CardStack
            navigationState={this.props.nav}
            renderScene={this.renderScene}
            renderHeader={this.renderHeader}/>
    }
    renderHeader(sceneProps) {
        const route = sceneProps.scene.route
        if (route.key == 'Splash') return null // Here we skip header on Splash screen
        // Next, we remove back navigation on second screen (optional)
        const onNavigateBack = sceneProps.scene.index > 1 ? this.navigateBack : undefined
        return <Header {...sceneProps} onNavigateBack={onNavigateBack}/>
    }
}

如何从导航实验中隐藏导航标题只能从特定页面反应本机？

1 个答案: