包含选项卡式导航器的Stacknavigator忽略其中一条路径

问题描述 投票:0回答:2

我有一个StackNavigator包含一个选项卡式导航器(带有两个选项卡)和一个路径CreateReviewsScreen,它不在选项卡式导航器中。当我尝试从CreateReviewsScreen导航回选项卡式导航器时,我无法执行此操作。我相信这是因为构建时忽略了单一路径CreateReviewsScreen。

在我的app容器的navigationRef中,只有选项卡式导航器“Tabs”。缺少“CreateReviewScreen”。下面照片中的长度应为2而不是1。

enter image description here

代码的相关部分:

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
});

Navigation.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',
  }
));
reactjs react-native react-navigation jsx nested-routes
2个回答
0
投票

试试这个.props.navigation.goBack(null)


0
投票

事实证明我没有观察到正确的错误。上一个堆栈项的后退行为正在发生,但是在Expo中远程调试导致了10秒的延迟。在重新启动应用程序之前,我没等多久就知道这是问题所在。禁用远程调试使后退按钮即时工作。

© www.soinside.com 2019 - 2024. All rights reserved.