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

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

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

navigationOptions: { header: { visible: false } }

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


当前回答

这将从组件类中删除头文件。

export default class SampleClass extends Component {
    navigationOptions = {
       headerMode: 'none'
    }
...
}

其他回答

如果你的屏幕是一个类组件

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

在目标屏幕中将其编码为第一个方法(函数)。

React原生导航v6.x 2022年5月

在屏幕选项道具中的headershows属性中设置false

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

附: const Stack = createNativeStackNavigator()。

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

options={{headershows: false}}为我工作。

** “@react-navigation/native”: “^5.0.7”, “@react-navigation/stack”: “^5.0.8”,

const MyNavigator = createStackNavigator({
  FirstPage: {screen : FirstPageContainer, navigationOptions: { headerShown:false } },
  SecondPage: {screen : SecondPageContainer, navigationOptions: { headerShown: false } }
});

//header:null will be removed from upcoming versions

尝试最好的方法,下面的代码适用于我。

options={{
    headerShown: false,
}}

把上面的代码放在<Stack中。屏幕标签。

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