Question

我有一个react项目，我有两个导航器，我试图删除导航栏，我尝试了两种方法，但没有成功。这是我的App.js

const switchNavigator = createStackNavigator({
  loginFlow: createStackNavigator({
    Signin: {
      screen: SigninScreen,
      navigationOptions: {
        headerShown: 'false'
      }
    },
    Signup: {
      screen: SignupScreen,
    },
  },
  ),
  mainGrid: createStackNavigator({
    Account: AccountScreen,
    Bath: BathScreen,
    Eco: EcoBath,
    Electricity: ElectricityConsScreen,
    Water: WaterConsumptionScreen,
    Help: HelpScreen,
    Parents: ParentsControlScreen
  })
});

如您所见，我尝试使用headerShown隐藏：'false'我试图更改为'hide'，但似乎不起作用。我试图像这样单独添加：

SigninScreen.navigationOptions = () => {
    return{ 
        header: () => false
    };
};

但是也没有用。我试图删除箭头功能并设置为header：null，也没有成功。我该怎么办？

Answer 1

如果您是using react-navigation V5：

<Stack.Screen options={{headerShown: false}} name="route-name" component={ScreenComponent} />

else：

隐藏1个屏幕的标题：

const AppStackNavigator = createStackNavigator ({
    Home: {
        screen: HomePage, 
        navigationOptions: {
            header: null,
        },
    },
})

或

export default class HomePage extends Component {
    static navigationOptions = {
        header: null
    }
}

隐藏所有屏幕的标题：

const AppStackNavigator = createStackNavigator ({
    Home: {
        screen: HomePage,
    },
},
{
    navigationOptions: {
        header: null,
    },
})

'navigationOptions'中的弃用：-'header：null'将被删除在将来的版本中。改用'headerShown：false'

const AppStackNavigator = createStackNavigator ({
    Home: {
        screen: HomePage, 
        navigationOptions: {
            headerShown: false
        },
    },
})

Answer 2

我在代码中使用了以下内容：

const AppStackNavigator = createStackNavigator ({
    Home: HomePageScreen
},
{
   headerMode: "none"
});

https://reactnavigation.org/docs/stack-navigator/#headermode

Answer 3

我解决的伙伴！我正在使用导航v4。问题在这里

const switchNavigator = createStackNavigator({

然后我交换了t

const switchNavigator = createSwitchNavigator({

并添加

SigninScreen.navigationOptions = () => {
    return {
      header: false
    };
};

现在，它的工作就像是一种咒语，但是小伙子们回答的所有答案都是正确的。我在其他版本中使用过。谢谢您的时间。

反应导航标题不隐藏

3 个答案: