headerShown、headerTitle和其他选项在屏幕上不起作用

Question

我是React Native的新手，我正在尝试创建一些东西来学习和测试。。。

现在，我正在尝试创建一个带有登录屏幕和"登录区域"中的其他屏幕的应用程序。所以，我想在"登录区域"屏幕上使用标题栏，但不想在登录屏幕上使用。

为此，我尝试使用React Navigation，其中包含Stack.Screen上的选项。但不起作用。。。

这是我当前的代码：

[...]
const Stack = createStackNavigator();
[...]
<NavigationContainer>
<Stack.Navigator headerMode="screen">
<Stack.Screen headerTitle="Test" headerShown={false} screenOptions={{headerTitle: 'Test', headerShown: false}} name="Login" component={Login} />
</Stack.Navigator>
</NavigationContainer>
[...]

我正在测试headerTitle和headerShown是作为属性还是作为screenOptions选项。。。但什么都不起作用。

现在，我的屏幕在标题中有一个"Login"标题(忽略headerTitle属性和选项(，并显示标题(忽略了headerShown属性和选项。

有人能告诉我我做错了什么吗？

Answer 1

screenOptions是Stack中的道具。导航器，而不是来自Stack。屏幕

headerTitle和headerShown都是选项，而不是道具，因此它们必须在选项中。

因此，要么将"screenOptions"更改为"options"：

<Stack.Screen options={{headerTitle: 'Test', headerShown: true}} name="Login" component={Login} />

或者将其移动到Stack。导航器(注意，它将应用于导航器内的所有屏幕(：

<Stack.Navigator headerMode="screen" screenOptions={{headerTitle: 'Test', headerShown: true}}>