Question

我正在尝试让bottomTabNavigator显示在所有屏幕上。这就是我的设置方式，我还不太了解反应导航的工作原理，但是根据我的阅读，bottomTabNavigator应该是添加了堆栈导航器的顶级组件，我不确定该怎么做。

AppNavigator.js

export default createAppContainer(
  createSwitchNavigator({
    Main: MainTabNavigator,
    Landing: LandingScreen,
    Menu: MenuNavigator

  })
);

MainTabNavigator.js

...

const tabNavigator = createBottomTabNavigator({
  HomeStack,
  CalendarStack,
  BoardStack,
  MomentsStack
});

tabNavigator.path = '';


export default tabNavigator;

MenuNavigator.js

const MenuNavigator= createStackNavigator({
    Settings: { screen: SettingsScreen },
    Contact: {screen: ContactScreen},
    Faq: {screen: FaqScreen},
    Help: {screen: HelpScreen}

  });

export default MenuNavigator;

Answer 1

只需使用createStackNavigator在createBottomTabNavigator中添加路径。例如，我必须转到设置并通过家庭导航进行联系

public function someFunction() {
$user = Auth::user();
//$user->ip;
}

Answer 2

如果您想在应用程序的所有屏幕中都包含底部标签，则应按以下方式创建

const tabNavigator = createBottomTabNavigator({
  HomeStack,
  CalendarStack,
  BoardStack,
  MomentsStack
});
and
export default createAppContainer(
  createSwitchNavigator({
    Main: tabNavigator ,
   ,
   

  })
);

Answer 3

注意-标签导航器仅在以下屏幕上可用在tabNavigator堆栈下定义。所以你必须保持你的以您要在其中显示标签的屏幕的方式堆叠导航器必须位于选项卡导航器堆栈中。

Answer 4

您的主标签屏幕，包括此导航选项，navigationOptions:{tabBarVisible:true}

const Tabs=createBottomTabNavigator({ myorder:{screen:MyOrderScreens, navigationOptions:{ tabBarLable:'Myorder', tabBarVisible:true, tabBarIcon:({navigation})=>( <Image source={require('./images/orders_1.png')} style={{width:30,height:30}}/> ) } },

React Native：在所有页面上显示bottomTabNavigator

4 个答案: