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' 选项工作......但没有任何效果。

现在，我的屏幕在标题中有一个“登录”标题（忽略headerTitle属性和选项）并显示标题（忽略headerShown属性和选项）。

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

Answer 1

screenOptions是来自 Stack.Navigator 的道具，而不是来自 Stack.Screen。

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

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

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

或者将其移动到 Stack.Navigator（请注意，它会应用于导航器内的所有屏幕）：

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