React Native子栈页面隐藏父栈头部，消除双头部问题

问题根源是主导航栈中的Onboarding页面自带默认头部，而子栈OnboardingStack内的页面又配置了自定义头部，两者叠加导致双头部现象。你之前在父栈全局设置screenOptions={{headerShown: false}}会隐藏所有页面的头部，包括子栈的自定义头部，这不符合需求。

只需给父栈中对应OnboardingStack的Stack.Screen单独配置headerShown: false，就能只隐藏父栈的默认头部，保留子栈的自定义头部：

修改后的MainNavigation代码：

const MainNavigation = () => {
return (
    <NavigationContainer>
        <Stack.Navigator id={'MainStack'}>
            <Stack.Screen
                name="SplashScreen"
                component={Splash}
                options={{ headerShown: false }}
            />
            {/* 单独隐藏该页面的父栈默认头部 */}
            <Stack.Screen 
                name="Onboarding" 
                component={OnboardingStack} 
                options={{ headerShown: false }} 
            />
            <Stack.Screen name="Auth" component={AuthStack} />
            <Stack.Screen
                name="Home"
                options={{ headerShown: false }}
                component={Tabs}
            />
        </Stack.Navigator>
    </NavigationContainer>
);
};

修改后，父栈的Onboarding页面不再显示默认的浅灰色头部，子栈中OnboardingStep1和OnboardingStep2的自定义<Header>会正常单独展示，不会出现双头部问题。

内容的提问来源于stack exchange，提问作者ngwomo