CODEWITHSUNDEEP
react-nativereact-native-navigation
Samuel Viol
Samuel Viol

Reputation: 11

Hide header in tabNavigator

I have this navigator, I want to hide the header only from component = {PagRoutes} (pagRoutes is a tabNavigator) I appreciate any help

export default function Routes() {
    return (
        <Stack.Navigator
            initialRouteName='Login'
            >

            <Stack.Screen
                name="Home"
                component={PagRoutes}
                options={{ 
                    title: 'Dashboard'
                }}
            />

            <Stack.Screen name="Login" component={Login}
                options={{
                    headerTitleAlign: 'center',
                    title: 'Login',
                }} />

            <Stack.Screen name="Registro" component={Registro}
                options={{
                    headerTitleAlign: 'center',
                    title: 'Registro',
                }} />
        </Stack.Navigator>
    )
}

export default function PagRoutes() {
    return (

            <Tab.Navigator>
                <Tab.Screen name="Home" component={Home} />
                <Tab.Screen name="Exercicios" component={Exercicios} />
            </Tab.Navigator>
    )
}

Upvotes: 0

Views: 147

Answers (1)

Jurrian
Jurrian

Reputation: 849

You can give extra config to the <Stack.Screen />. You're looking for the option: headerShown: none. I'd do something like this:

<Stack.Screen
  name="Home"
  component={PagRoutes}
  options={{
    title: 'Dashboard',
    headerShown: none
  }}
/>

Upvotes: 1

Related Questions