如何从createBottomTabNavigator中隐藏特定选项卡

问题描述 投票:2回答:1

我需要从选项卡导航器中隐藏登录选项卡,但我不确定如何。我尝试使用createStackNavigator加载登录屏幕,然后使用底部选项卡导航器将登录一次传递到主屏幕,但在所有不需要的屏幕上都留下了返回箭头。

  Login: {
    screen: LoginScreen,
    navigationOptions: { tabBarVisible: false },
    tabBarOptions: { showLabel: false, showIcon: false },
  },
  Home: {
    screen: HomeScreen,
    navigationOptions: {
      tabBarIcon: ({ tintColor }) => (
        <Icon name="ios-home" size={28} color={tintColor} />
      ),
      header: null,
    },
  },
  Calories: {
    screen: CalorieScreen,
    navigationOptions: {
      tabBarIcon: ({ tintColor }) => (
        <MaterialIcon name="food" size={38} color={tintColor} />
      ),
      header: null,
    },
  },
  Booking: {
    screen: BookingScreen,
    navigationOptions: {
      tabBarIcon: ({ tintColor }) => (
        <FontIcon name="dumbbell" size={24} color={tintColor} />
      ),
      header: null,
    },
  },
  Weight: {
    screen: WeightScreen,
    navigationOptions: {
      tabBarIcon: ({ tintColor }) => (
        <FontIcon name="weight" size={26} color={tintColor} />
      ),
      header: null,
    },
  },
  Calendar: {
    screen: CalendarScreen,
    navigationOptions: {
      tabBarIcon: ({ tintColor }) => (
        <MaterialIcon name="calendar-month" size={28} color={tintColor} />
      ),
      header: null,
    },
  },
})

react-native react-native-android react-navigation
1个回答
1
投票

成功登录后,您应使用createSwitchNavigator阻止用户返回登录屏幕。这里是一个来自react-navigation docs的实现示例:

https://reactnavigation.org/docs/en/auth-flow.html

© www.soinside.com 2019 - 2024. All rights reserved.