Как скрыть навигатор нижней вкладки материала в навигаторе с вложенным стеком в реагировать родной - PullRequest
0 голосов
/ 12 апреля 2020

Я использую материал Bottom Tab Navigator, Мое приложение структурировано так, что некоторые вкладки содержат навигатор стека. Я хочу скрыть нижние вкладки, когда пользователь переходит на другой стек в навигаторе стека. Я использую реагирующую навигацию v5. Я не хочу, чтобы нижние вкладки отображали, когда пользователь уже перешел на стек.

1 Ответ

0 голосов
/ 21 апреля 2020

Я сделал вам базовый c пример того, что вы спрашиваете. Я надеюсь, что это то, что вы ищете:

import React from 'react'
import { Button, View, Text, StyleSheet } from 'react-native'
import { NavigationContainer } from '@react-navigation/native'
import { createMaterialBottomTabNavigator } from '@react-navigation/material-bottom-tabs'
import { createStackNavigator } from '@react-navigation/stack'

const Screen1 = ({ navigation }) => (
    <View style={styles.component}>
        <Button title="Go to NoBottomComp" onPress={() => navigation.navigate('NoBottomComp')} />
    </View>
)
const Screen2 = () => <View style={styles.component}><Text>Screen 2 component</Text></View>

const NoBottomComp = () =>  <View style={styles.component}><Text>Screen without bottom component</Text></View>

const Footer = createMaterialBottomTabNavigator()

const FooterNav = () => (
    <Footer.Navigator>
        <Footer.Screen name="Screen1" component={Screen1} />
        <Footer.Screen name="Screen2" component={Screen2} />
    </Footer.Navigator>
)

const Main = createStackNavigator()

export default props => (
    <NavigationContainer>
        <Main.Navigator>
            <Main.Screen name="BottomNav" component={FooterNav} />
            <Main.Screen name="NoBottomComp" component={NoBottomComp} />
            {/* As many screens as you want to be without bottom tabs */}
        </Main.Navigator>
    </NavigationContainer>
)

const styles = StyleSheet.create({
    component: {
        flex: 1,
        justifyContent: 'center',
        alignItems: 'center',
    }
})
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...