时间戳

首页 > 解决方案 > 从反应导航中删除标题

typescript - 从反应导航中删除标题

问题描述

我使用的是react-navigation版本 6，想知道如何从标题中删除该标题，默认情况下，它已经显示了我们通过的页面的名称。

在版本 5 中，传递给headerModethis 已经被删除，但在这个新版本中，我没有找到如何删除它。

我的代码：

import React from 'react';

import { createStackNavigator } from '@react-navigation/stack';

import { Home } from '../screens/Home';
import { Search } from '../screens/Search';

const { Navigator, Screen } = createStackNavigator();

export function AppStackRoutes() {
  return (
    <Navigator initialRouteName="Search">
      <Screen 
        name="Search" 
        component={Search} 
      />
      <Screen 
        name="Home" 
        component={Home} 
      />
    </Navigator>
  )
}

标签： typescriptreact-navigationreact-native-navigation

解决方案

用于headerShown隐藏或显示标题栏。

阅读此迁移指南和文档：

以前，您可以通过 headerMode="none" 属性将标题隐藏在堆栈导航器中。但是，还有一个 headerShown 选项可用于隐藏或显示标题，它支持按屏幕配置。

<Navigator 
    initialRouteName="Search" 
    screenOptions={{ headerShown: false }}
>
    <Screen 
        name="Search" 
        component={Search} 
    />
    <Screen 
        name="Home" 
        component={Home} 
    />
</Navigator>

推荐阅读