typescript 从React导航中删除标题

9rnv2umw  于 2022-11-18  发布在  TypeScript
关注(0)|答案(2)|浏览(139)

我正在使用react-navigation版本6,想知道如何从页眉中删除该标题,默认情况下,页眉已经显示了我们传递的页面的名称。
在版本5中,传递给headerMode的这个已经被删除了,但是在这个新版本中我没有找到如何删除它。
我的代码:

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>
  )
}
e37o9pze

e37o9pze1#

使用headerShown隐藏或显示标题栏。
阅读本迁移指南和文档:
以前,你可以传递headerMode=“none”prop来隐藏栈导航器中的头。但是,也有一个headerShown选项可以用来隐藏或显示头,它支持按屏幕配置。

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

ozxc1zmp2#

headerTitle设置为空字符串,以隐藏标题名称

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

相关问题