我试图使用堆栈和选项卡导航器切换屏幕。

const MainNavigation = StackNavigator({
      otp: { screen: OTPlogin },
      otpverify: { screen: OTPverification},
      userVerified: {
        screen: TabNavigator({
          List: { screen: List },
          Settings: { screen: Settings }
        }),
      },
    });

在这种情况下,首先使用堆栈导航器,然后使用制表器。我想从堆栈导航器中隐藏头文件。这是不正常工作时,我使用导航选项::

navigationOptions: { header: { visible: false } }

我试图在前两个组件上使用这段代码在stacknavigator。 如果我使用这一行,然后得到一些错误,如:


当前回答

在stackNavigator中添加新的navigationOptions对象。

试试这个:

const MainNavigator = createStackNavigator({
  LoginPage: {screen : LoginPageContainer, navigationOptions: { header: null } },
  MiddlePage: {screen : MiddlePageContainer, navigationOptions: { header: null } },
  SMS: {screen: ShowSmsContainer, navigationOptions: { header: null } },
  Map: {screen: ShowMapContainer, navigationOptions: { header: null } }
});

希望能有所帮助。

其他回答

在react-navigation的最新版本中,这可以在每个屏幕上隐藏标题:

<堆栈。领航员 headerMode ={“郎”} > <堆栈。屏幕 <堆栈。屏幕名 < /堆栈。领航员>

如果你想从整个屏幕中删除头部,去app.js并将这段代码添加到Stack中。导航器

screenOptions={ { headerShown: false } }

在你的目标屏幕上,你必须编写这样的代码!

 static navigationOptions = ({ navigation }) => {
    return {
       header: null
    }
 }

v6

headerMode道具已从react导航6.x中移除。现在我们可以使用headershows选项来实现相同的结果。

<Stack.Navigator screenOptions={{ headerShown: false }}>
   {/* Your screens */}
</Stack.Navigator>

v5

在react导航5。你可以通过将Navigator的headerMode道具设置为false来隐藏所有屏幕的头部。

<Stack.Navigator headerMode={false}>
   {/* Your screens */}
</Stack.Navigator>

如果你只想从react-native-navigation的一个屏幕上删除它,那么:

<Stack.Navigator>
    <Stack.Screen 
            name="Login" 
            component={Login} 
            options= {{headerShown: false}} />
</Stack.Navigator>