时间戳

首页 > 解决方案 > 在 React Native 中需要帮助管理导航器

react-native - 在 React Native 中需要帮助管理导航器

问题描述

我目前正在实现一个小型 React Native 应用程序，这是我目前拥有的导航器：

    const RootNav=  createStackNavigator(
     {
      Login: LogInScreen,
     },
    );
    const TabNav = createBottomTabNavigator(
     {
      Home: { screen: HomeScreen },
      Calendar: { screen: CalendarScreen },
      Discussion: { screen: DiscussionScreen },
      Profile: { screen: ProfileScreen },
     },
    );
    export const SwitchNav = createSwitchNavigator(
     {
      AuthLoading: AuthLoadingScreen,
      Auth: RootNav,
      MainApp: TabNav,
     },
     {
      initialRouteName: 'AuthLoading',
     },
    );

现在在 HomeScreen 和 CalendarScreen 中，有几个Card组件应该导航到另一个屏幕，该屏幕的名称EventScreen是返回到上一个屏幕的选项，createStackNavigator我认为这应该是另一个屏幕，但我仍然需要帮助什么是设置导航器的正确方法。提前致谢。

标签： react-native

解决方案

你可以有一个父母StackNavigator和它EventScreen的TabNav孩子：

const RootNav = createStackNavigator(
  {
    Login: LogInScreen,
  }
);

const HomeNav = createStackNavigator(
  {
    tabNav: TabNav,
    Events: { screen: EventScreen },
  }
);

const TabNav = createBottomTabNavigator(
  {
    Home: { screen: HomeScreen },
    Calendar: { screen: CalendarScreen },
    Discussion: { screen: DiscussionScreen },
    Profile: { screen: ProfileScreen },
  }
);

export const SwitchNav = createSwitchNavigator(
  {
    AuthLoading: AuthLoadingScreen,
    Auth: RootNav,
    MainApp: HomeNav,
  },
  {
    initialRouteName: 'AuthLoading',
  }
);

如果你觉得你将来也需要一个DrawerNavigation，那么现在就照顾它是个好主意。这篇文章可能会有所帮助。

推荐阅读