如何在特定屏幕上隐藏底部标签栏导航器？

Question

我正在使用 React 导航版本 4。 我的目标是仅在完成屏幕上隐藏标签栏导航器。 都没有

tabBarStyle: { display: "none" }

也不

tabBarVisible: false

工作。

我的导航器是这样的：

const navigator = createSwitchNavigator({
  resolveAuth: ResolveAuthScreen,
  default: createBottomTabNavigator({
    unAuthenticatedFeed: UnAuthenticatedFeedScreen,
    camera: UnavailableScreen,
    signupFlow: createStackNavigator({
    selectAuthentication: SelectAuthenticationScreen,
    login: LoginScreen,
    signup: SignupScreen,
    forgotPw: ForgotPasswordScreen,
    storageChoice: StorageChoiceScreen,
    validateSeedPhrase: validateSeedPhraseScreen,
    done: {
      screen: DoneScreen,
      navigationOptions:{
        headerShown: false,
        tabBarStyle: { display: "none" },
        tabBarVisible: false
      }
    }
      })
    }),
  mainFlow: createBottomTabNavigator({
    feed: FeedScreen,
    camera: CameraScreen,
    profile: ProfileScreen,
    }),
})

有人知道为什么会这样吗？ 感谢您的任何建议！

Answer 1

我解决了：

signupFlow.navigationOptions = ({navigation}) =>{
  let tabBarVisible = true;
  let routeName = navigation.state.routes[navigation.state.index].routeName
  if ( routeName == 'done' ) {
      tabBarVisible = false
  }
  return {
      tabBarVisible,
  }
}

const navigator = createSwitchNavigator({
  resolveAuth: ResolveAuthScreen,
  default: createBottomTabNavigator({
    unAuthenticatedFeed: UnAuthenticatedFeedScreen,
    camera: UnavailableScreen,
    signupFlow: signupFlow
  },
  {
    defaultNavigationOptions: ({ navigation }) => ({
      tabBarIcon: ({ focused, horizontal, tintColor }) => {
        const { routeName } = navigation.state
        let iconName
        if (routeName === 'unAuthenticatedFeed') {
          iconName = focused ? 'home' : 'home'
          return <Feather name={iconName} size={25} color={tintColor} />
        }
        else if (routeName === 'camera') {
          iconName = focused ? 'camera' : 'camera'
          return <Feather name={iconName} size={25} color={tintColor} />
        }
        else if (routeName === 'signupFlow') {
          iconName = focused ? 'login' : 'login'
          return <Entypo name={iconName} size={25} color={tintColor} />
        }
      },
    }),
    tabBarOptions: {
      activeTintColor: 'blue',
      inactiveTintColor: 'gray',
      showLabel: false
    },
})}