在react-navigation中從StackNavigator隱藏BottomTabNavigator的標題

Question

我正在嘗試在BottomTabNavigator中隱藏標題，但此標題來自StackNavigator。 我已經嘗試過使用標頭：在頁面內使用null和其他方法，但是沒有任何效果！

const AppTabNav = createBottomTabNavigator({
  HomeScr:{
    screen:Home,navigationOptions:{tabBarLabel:'Inicio',tabBarIcon: ({tintColor}) => (<Icon name='home' color={tintColor} size={25}/>)}
  },
  Settings:{
  screen:Config,navigationOptions:{ tabBarLabel:'Configurações',tabBarIcon:({ tintColor })=>(<Icon name="settings" color={tintColor} size={25}/>)}
  }

})

const AppStackNavigator = createStackNavigator({
  AppTab:{
    screen:AppTabNav,
    navigationOptions:({navigation}) =>({
     title:'Bem vindo @USER',      
     headerLeft:(
        <TouchableOpacity onPress={() => navigation.toggleDrawer()}>
        <View style={{paddingHorizontal:10}}>
          <Icon name="menu" color='black' size={24}/>
        </View>        
        </TouchableOpacity>)
        })
  }
},{tabBarOptions:{
  activeTintColor:'blue',
  inactiveTintColor:'black'
}})

這是當我單擊底部的配置時要隱藏的標題

IMAGEM

這是Config.js文件的代碼

export default class Config extends Component {
  static navigationOptions = { 
    header: null,
    drawerIcon: ({ tintColor }) => ( <Icon name='settings' style={{color:tintColor ,fontSize:24}} />)
    }
  SignOut = async() => {
    AsyncStorage.clear()
    this.props.navigation.navigate('AuthLoading')
  }

    render() {
      return (
          <Container>
          <Header>
            <Left style={{flex:1}}>
            <Icon name="menu" color='black' size={24} onPress={() => this.props.navigation.openDrawer()}/>
            </Left>
            <Body style={{flex: 1,justifyContent: 'center'}}>
              <Title>Configurações</Title>
            </Body>
            <Right style={{flex:1}}/>
          </Header>
          <View style={{flex :1, alignItems:'center', justifyContent:'center'}}>                    
                    <Text>Configurações</Text> 
                    </View> 
        </Container>
      );
  }
}

Answer 1

只需將其添加到您的組件代碼中，標題將被隱藏

tabBarVisible：否

export default class Config extends Component {
  static navigationOptions = { 
    tabBarVisible: false,
    drawerIcon: ({ tintColor }) => ( <Icon name='settings' style={{color:tintColor ,fontSize:24}} />)
    }
  SignOut = async() => {
    AsyncStorage.clear()
    this.props.navigation.navigate('AuthLoading')
  }

    render() {
      return (
          <Container>
          <Header>
            <Left style={{flex:1}}>
            <Icon name="menu" color='black' size={24} onPress={() => this.props.navigation.openDrawer()}/>
            </Left>
            <Body style={{flex: 1,justifyContent: 'center'}}>
              <Title>Configurações</Title>
            </Body>
            <Right style={{flex:1}}/>
          </Header>
          <View style={{flex :1, alignItems:'center', justifyContent:'center'}}>                    
                    <Text>Configurações</Text> 
                    </View> 
        </Container>
      );
  }
}

在react-navigation中從StackNavigator隱藏BottomTabNavigator的標題

問題描述

1 個解決方案

解決方案1
0 2018-11-23 15:24:22

在react-navigation中從StackNavigator隱藏BottomTabNavigator的標題

問題描述

1 個解決方案

解決方案1 0 2018-11-23 15:24:22

解決方案1
0 2018-11-23 15:24:22