Как скрыть навигатор нижней панели вкладок на определенном экране?

Я использую реагирующую навигацию версии 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,
    }),
})

кто-нибудь знает, почему это может быть так? спасибо за любой совет!

Умерло ли Create-React-App?
Умерло ли Create-React-App?
В этом документальном фильме React.dev мы исследуем, мертв ли Create React App (CRA) и какое будущее ждет этот популярный фреймворк React.
Освоение React Native: Пошаговое руководство для начинающих
Освоение React Native: Пошаговое руководство для начинающих
React Native - это популярный фреймворк с открытым исходным кодом, используемый для разработки мобильных приложений. Он был разработан компанией...
В чем разница между react native и react ?
В чем разница между react native и react ?
React и React Native - два популярных фреймворка для создания пользовательских интерфейсов, но они предназначены для разных платформ. React - это...
От React к React Native: Руководство для начинающих по разработке мобильных приложений с использованием React
От React к React Native: Руководство для начинающих по разработке мобильных приложений с использованием React
Если вы уже умеете работать с React, создание мобильных приложений для iOS и Android - это новое приключение, в котором вы сможете применить свои...
Хуки React: что это такое и как их использовать
Хуки React: что это такое и как их использовать
Хуки React - это мощная функция библиотеки React, которая позволяет разработчикам использовать состояние и другие возможности React без написания...
0
0
44
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 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
    },
})}

Другие вопросы по теме