У меня есть приложение, которое состоит из навигации с вкладками с 5 экранами, и один из них представляет собой стековую навигацию из двух экранов. На одном из двух стековых экранов я хочу скрыть нижние вкладки. Как я могу это сделать?
Я уже проверил React Navigation V5 Скрыть нижние вкладки , но когда я попытался использовать navigation.setOptions({ tabBarVisible: false })
, он изменил параметры стекового навигатора, а не вкладки.
Вот мой код
// Screen where I want to hide the BottomTabNavigator
function StackSecondScreen({ navigation }) {
return (
<View
style={{
flex: 1,
justifyContent: "center",
alignItems: "center",
backgroundColor: "indianred"
}}
>
<Text>StackSecondScreen</Text>
</View>
);
}
const Stack = createStackNavigator();
function TabFirstScreen({ navigation }) {
return (
<Stack.Navigator initialRouteName="StackFirst">
<Stack.Screen
name="StackFirst"
component={StackFirstScreen}
options={{
headerShown: false
}}
/>
<Stack.Screen name="StackSecond" component={StackSecondScreen} /> // <== Screen where I want to hide the BottomTabNavigator
</Stack.Navigator>
);
}
const Tab = createBottomTabNavigator();
export default function App() {
return (
<NavigationContainer>
<Tab.Navigator initialRouteName="First">
<Tab.Screen name="TabFirst" component={TabFirstScreen} />
<Tab.Screen name="TabSecond" component={TabSecondScreen} />
<Tab.Screen name="TabThird" component={TabThirdScreen} />
<Tab.Screen name="TabFourth" component={TabFourthScreen} />
<Tab.Screen name="TabFifth" component={TabFifthScreen} />
</Tab.Navigator>
</NavigationContainer>
);
}