Пользовательский заголовок React Navigation не исчезает при удалении от экрана (только iOS)

Question

У меня есть стековый навигатор, где на одном из экранов используется пользовательский заголовок:

import { createStackNavigator } from "@react-navigation/stack";
import * as React from "react";
import { Button, View } from "react-native";

const Stack = createStackNavigator();

function ScreenA({ navigation }) {
    return (
        <View style={{ flex: 1, justifyContent: "center"}}>
            <Button title="Click me" onPress={() => navigation.navigate("ScreenB")} />            
        </View>
    );
}

function ScreenB({ navigation }) {
    return (
        <View style={{ flex: 1 , justifyContent: "center"}}>
            <Button title="Click me" onPress={() => navigation.navigate("ScreenA")} />
        </View>
    );
}

function TestComp() {
    return (
        <Stack.Navigator>
            <Stack.Screen
                name="ScreenA"
                component={ScreenA}
                options={{ header: () => <View style={{ height: 160, backgroundColor: "red" }}></View> }}
            />
            <Stack.Screen name="ScreenB" component={ScreenB} />
        </Stack.Navigator>
    );
}

export default TestComp;

В результате заголовок ScreenA (красная полоса) виден из ScreenB. Этого не происходит в Android, где заголовок правильно отображается ТОЛЬКО на ScreenA.

Как остановить заголовок ScreenA от показа на экране B?

Answer 1

Решил с помощью <Stack.Navigator headerMode="screen">!