在堆栈导航器中隐藏标头反应导航 [英] Hide header in stack navigator React navigation

问题描述

我正在尝试使用堆栈和标签导航器切换屏幕。

I'm trying to switch screen using both stack and tab navigator.

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

在这种情况下首先使用stacknavigator，然后使用tabnavigator。我想隐藏堆栈导航器的标题。当我使用像::

In this case stacknavigator is used first and then tabnavigator. and i want to hide headers of stack navigator. WIt is not working properly when i use navigationoptions like::

navigationOptions: { header: { visible: false } }

我正在尝试使用stacknavigator中使用的前两个组件上的代码。
如果我使用这一行然后得到一些错误，如::

i'm trying this code on first two components which are using in stacknavigator. if i use this line then getting some error like::

推荐答案

我用它来隐藏堆栈栏（注意这是第二个参数的值）：

I use this to hide the stack bar (notice this is the value of the second param):

{
    headerMode: 'none',
    navigationOptions: {
        headerVisible: false,
    }
}

使用此方法时，它将隐藏在所有屏幕上。

When you use the this method it will be hidden on all screens.

在您的情况下，它将如下所示：

In your case it will look like this:

const MainNavigation = StackNavigator({
  otp: { screen: OTPlogin },
  otpverify: { screen: OTPverification },
  userVerified: {
    screen: TabNavigator({
    List: { screen: List },
    Settings: { screen: Settings }
   }),
 }
},
{
  headerMode: 'none',
  navigationOptions: {
    headerVisible: false,
  }
 }
);

这篇关于在堆栈导航器中隐藏标头反应导航的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！