react native 使用react-navigation (嵌套路由) 隐藏标题栏

AppNavigator 的header给隐藏掉,先给每一个控制器加上导航栏在隐藏TabNavigator 的导航栏

const Tab = createBottomTabNavigator({
    Home: {
        screen: HomePage,
    },
    Classfy: {
        screen: ClassfyPage,
    },
    Chart: {
        screen: ChartPage,
    },
    Setting: {
        screen: SettingPage,
    }
}, {
    animationEnabled: true,
    swipeEnabled: false,
    swipeEnabled: true,//是否可以滑动切换
    animationEnabled: true,//切换是否有动画
    initialRouteName: 'Home', //进入App的首页面
    backBehavior: 'none', // 按 back 键是否跳转到第一个 Tab, none 为不跳转
    tabBarOptions: { //对于导航的设置
        indicatorStyle: {height: 0},  //android特有下划线的颜色1
        inactiveTintColor: '#a9a9a9', // 文字和图片默认颜色
        activeTintColor: color.activeBarText,
        labelStyle: {     //文字的样式
            fontSize: 10,
            textAlign: 'center',
        },
        style: {    //对于导航的stytles
            backgroundColor: 'white', // TabBar 背景色
            borderTopColor: '#ebebeb',
            borderTopWidth: 1,
            height: Dimensions.get('window').height * 0.08,
            height: 50
        }
    },
});

Tab.navigationOptions = ({navigation}) => {
    //  关键这一行设置 header:null
    return{
        header: null,
    }
};

export default Tab;

你可能感兴趣的:(react native 使用react-navigation (嵌套路由) 隐藏标题栏)