React Navigation 头部未隐藏。

26 浏览
0 Comments

React Navigation 头部未隐藏。

我有一个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也没有成功。

我应该怎么办？

admin 更改状态以发布 2023年5月21日
0

2 答案

0 Comments

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

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

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

0
0 Comments

如果您正在使用react-navigation V5:

否则:

为一个屏幕隐藏标题:

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
        },
    },
})

0