包含选项卡式导航器的 Stacknavigator 会忽略其中一条路线答案

【问题标题】：Stacknavigator containing tabbed navigator ignores one of the routes包含选项卡式导航器的 Stacknavigator 会忽略其中一条路线
【发布时间】：2019-07-20 00:23:42
【问题描述】：

我有一个 StackNavigator，它包含一个选项卡式导航器（带有两个选项卡）和一个不在选项卡式导航器内的 CreateReviewsScreen 路由。当我尝试从 CreateReviewsScreen 导航回选项卡式导航器时，我无法这样做。我相信这是因为在构建时忽略了单一路线 CreateReviewsScreen。

在我的应用程序容器的 navigationRef 中，只有选项卡式导航器“Tabs”。缺少“CreateReviewScreen”。下图中的长度应该是 2 而不是 1。

相关代码段：

TabNav.js

import { createBottomTabNavigator, createStackNavigator } from 'react-navigation';
import { ReviewsScreen, VenuesScreen, CreateReviewsScreen } from '../scenes';
import { APP_COLORS } from '../styles/Global';

const mainTabs = createBottomTabNavigator(
  {
    Reviews: ReviewsScreen,
    Venues: VenuesScreen
  },
  {
    initialRouteName: 'Reviews',
    backBehavior: 'Reviews',
    tabBarOptions: {
      activeTintColor: APP_COLORS.FORE,
      labelStyle: {
        fontSize: 18,
        textAlign: 'center'
      },
      style: {
        backgroundColor: APP_COLORS.PRI_LGHT,
      },
    }
  }
);

export default createStackNavigator({
  Tabs: mainTabs,
  CreateReviews: CreateReviewsScreen
});

导航.js

import { createStackNavigator, createSwitchNavigator } from 'react-navigation';
import { createAppContainer } from '@react-navigation/native';
import { LoggedOutScreen, LoginScreen, RegisterScreen, UserProfileScreen } from './scenes/index';
import TabNav from './Drawer/TabNav';


const AuthStack = createStackNavigator({
  LoggedOut: { 
   screen: LoggedOutScreen, 
   navigationOptions: {
     header: null
   }
  },
  Login: {
    screen: LoginScreen, 
    navigationOptions: {
      title: 'Login'
    }
  },
  Register: {
    screen: RegisterScreen,
    navigationOptions: {
      title: 'Sign up!'
    }
  },
  UserProfile: {
    screen: UserProfileScreen,
    navigationOptions: {
      title: 'Your Profile'
    }
  }
});

export default createAppContainer(createSwitchNavigator(
  {
    Main: TabNav,
    Auth: AuthStack
  }, 
  {
    initialRouteName: 'Auth',
  }
));

【问题讨论】：

我猜routes 不显示路线数量，而是包含您移动到的所有路线的历史记录。
我自己也想知道，所以当我截取那个屏幕截图时，我在导航到任何其他屏幕之前在 App.js 中设置了断点。不过感谢您的想法！

标签： reactjs react-native react-navigation jsx nested-routes

【解决方案1】：

事实证明我没有观察到正确的错误。上一个堆栈项的返回行为正在发生，但由于 Expo 中的远程调试导致了 10 秒的延迟。在重新启动应用程序之前我没有等待足够长的时间来查看这是问题所在。禁用远程调试会使后退按钮立即生效。

【讨论】：

【解决方案2】：

试试 this.props.navigation.goBack(null)

【讨论】：

刚刚尝试过，但没有成功。什么都没发生。不过还是谢谢。