Question

我需要从选项卡导航器中隐藏登录选项卡，但我不确定如何。我尝试使用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,
    },
  },
})

Answer 1

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

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

如何从createBottomTabNavigator隐藏特定选项卡

1 个答案: