В React Native свойство headerShownиспользуется для управления видимостью заголовка в компоненте экрана в стеке навигации. Если установлено значение false, заголовок будет скрыт, а если установлено значение true, заголовок будет отображаться.

Вот несколько методов управления свойством headerShownв React Native:

1. Настройка headerShownв навигаторе стека:

   <Stack.Navigator>
    <Stack.Screen
      name="Home"
      component={HomeScreen}
      options={{ headerShown: false }}
    />
   </Stack.Navigator>

2. Настройка headerShownв компоненте экрана:

   function HomeScreen({ navigation }) {
    navigation.setOptions({ headerShown: false });
    // ...
   }

3. Условная установка headerShownна основе реквизитов экрана:

   function HomeScreen({ navigation, route }) {
    navigation.setOptions({ headerShown: route.params.headerVisible });
    // ...
   }

4. Использование хука useLayoutEffectдля динамического переключения headerShown:

   import { useLayoutEffect } from 'react';
   function HomeScreen({ navigation }) {
    useLayoutEffect(() => {
      navigation.setOptions({ headerShown: false });
    }, [navigation]);
    // ...
   }

5. Динамическое обновление headerShownво время переходов навигации:

   import { useNavigationState } from '@react-navigation/native';
   function HomeScreen() {
    const navigation = useNavigation();
    const currentRoute = useNavigationState(state => state.routes[state.index]);
    navigation.setOptions({ headerShown: currentRoute.name !== 'Home' });
    // ...
   }