有没有办法只删除特定屏幕的顶部导航栏?我正在使用react-navigation。
我已经尝试过以下方法:
header: { visible: false }
但它只隐藏了导航栏。导航栏的空间仍然无法使用。
提前致谢!
这是我使用StackNavigator的方式的一个例子:
const stackN = StackNavigator({
Screen1 : {
screen: Screen1,
navigationOptions: {
header: null,
}
},
Home : {
screen: HomeScreen,
navigationOptions: ({navigation}) => ({
title: 'Home',
headerStyle: styles.headerStyle,
headerTitle: <Text>Home</Text>,
headerLeft : null,
headerRight: null,
})
},
}, {headerMode: 'screen'})
所以每个屏幕都有自己的navigationOptions。可能有一种方法可以共享navigationOptions,但我目前还没有调查过。
使用createStackNavigator时,可以删除顶部导航栏,如下所示。
const AppStack = createStackNavigator({ Home: MainTabNavigator }, { headerMode: 'none' });
使用navigationOptions: { header: null }
删除顶部导航栏。
示例代码:
import { createStackNavigator, createAppContainer } from 'react-navigation';
import {Login} from './app/components/login/Login';
import {Register} from './app/components/register/Register';
import {Home} from './app/components/home/Home';
const AppNavigator = createStackNavigator(
{
Login: {
screen: Login,
navigationOptions: {
header: null,
}
},
Register: {
screen: Register,
navigationOptions: {
header: null,
}
},
Home: {
screen: Home,
navigationOptions: {
header: null,
}
},
},
{
initialRouteName: "Login"
}
);
export default createAppContainer(AppNavigator);