React native 如何在React Navigation 5中始终保留底部选项卡
我正经历着最艰难的时刻,试图弄明白如何始终保持底部的标签。 抽屉里有3件物品:React native 如何在React Navigation 5中始终保留底部选项卡,react-native,expo,react-navigation-v5,React Native,Expo,React Navigation V5,我正经历着最艰难的时刻,试图弄明白如何始终保持底部的标签。 抽屉里有3件物品: 标签 屏幕5 屏幕6 单击屏幕5或屏幕6时,我希望保留底部选项卡。我如何做到这一点?请帮忙 从“React”导入React; 从“react native”导入{Platform}; 从“react native”导入{Text,View,StyleSheet}; 从“反应导航标题按钮”导入{HeaderButtons,Item}; 从“react navigation header buttons”导入{H
从“React”导入React;
从“react native”导入{Platform};
从“react native”导入{Text,View,StyleSheet};
从“反应导航标题按钮”导入{HeaderButtons,Item};
从“react navigation header buttons”导入{HeaderButton};
从“@expo/vector icons”导入{Ionicons};
//导航5
从'@react-navigation/native'导入{NavigationContainer};
从'@react navigation/stack'导入{createStackNavigator};
从'@react导航/drawer'导入{createDrawerNavigator};
从“@react navigation/bottom tabs”导入{createBottomTabNavigator};
从“@react navigation/material bottom tabs”导入{createMaterialBottomTabNavigator};
//屏风
const styles=StyleSheet.create({
容器:{
弹性:1,
为内容辩护:“中心”,
对齐项目:“中心”
}
});
常量屏幕1=道具=>{
返回(
屏幕1
)
}
常量屏幕2=道具=>{
返回(
屏幕2
)
}
常量屏幕3=道具=>{
返回(
屏幕3
)
}
const Screen4=道具=>{
返回(
屏幕4
)
}
常量屏幕5=道具=>{
返回(
屏幕5
)
}
常量屏幕6=道具=>{
返回(
屏幕6
)
}
//堆叠
const CustomHeaderButton=props=>{
返回(
)
}
const defaultStackNavOptions={
headerTitleAlign:“中心”,
头部颜色:“白色”,
头型:{
背景颜色:“黑色”,
}
}
const defaultScreenOptions=navData=>{
返回{
标题左侧:()=>{
返回(
{
navData.navigation.toggleDrawer();
}}/>
)
},
}
}
const Screen1StackNavigator=createStackNavigator();
常量Sccreen1Stack=()=>{
返回(
)
}
const screensstacknavigator=createStackNavigator();
const Sccreen2Stack=()=>{
返回(
)
}
const Screen3StackNavigator=createStackNavigator();
const Sccreen3Stack=()=>{
返回(
)
}
const Screen4StackNavigator=createStackNavigator();
const Sccreen4Stack=()=>{
返回(
)
}
const Screen5StackNavigator=createStackNavigator();
常量Sccreen5Stack=()=>{
返回(
)
}
const Screen6StackNavigator=createStackNavigator();
常量Sccreen6Stack=()=>{
返回(
)
}
//底部标签
const AppTabNavigator=Platform.OS=='android'?createMaterialBottomTabNavigator():createBottomTabNavigator();
常量选项卡导航器=()=>{
返回(
)
}
//抽屉
const-AppDroperNavigator=createDroperNavigator();
常数抽屉驱动=()=>{
返回(
)
}
const TestNavigator=props=>{
返回(
);
}
导出默认TestNavigator代码>看起来您希望抽屉中的所有屏幕都显示底部选项卡。因此,您需要为这些屏幕添加选项卡导航器,而不是screen5stack
和screen6stack
否则,当您导航到Sccreen5Stack
时,选项卡栏不可见是没有意义的。选择了哪个选项卡?如果屏幕不在tab navigator中,当选项卡栏处于焦点时,您如何看到它?是的,我为抽屉中的每个项目创建了底部选项卡。我就快到了,现在当我点击项目抽屉时,如何将标签的路径重置为初始路径,因此如果我在“收件箱”屏幕上,有四个底部标签,如果我点击“存档”,然后打开抽屉,点击“删除的项目”,然后返回“收件箱”,你会看到活动标签仍然是“存档”。我想强制将其重置为初始值。这有点难以解释,但我希望你能理解我