时间戳

首页 > 解决方案 > 在本机反应中找不到堆栈导航器中的键的路由

react-native - 在本机反应中找不到堆栈导航器中的键的路由

问题描述

我正在制作一个反应本机项目，该项目因在堆栈导航器中找不到路由而出现错误。首先，这是我的应用程序导航代码。

const RootStack = createStackNavigator({
  Splash : { screen: Splash },
  ModelProfile: { screen: ModelProfile},
  HomeModel: {screen: modeldrawerNavigator},
  EnterOtp : { screen: EnterOtp},
  OtpChangePassword : { screen: OtpChangePassword},
}, {
  headerMode: 'none',
  initialRouteName: 'Splash'
})

const AppNavigator = createAppContainer(RootStack)
export default AppNavigator;

现在的代码modelDrawerNavigator是

const modeldrawerNavigator = createDrawerNavigator(
  {
    HomeScreen: { screen: homeStack},
    EditProfile : { screen: profileStack},
    BuyStar : { screen: StarStack},
    Notifications : { screen: nStackmodel},
    ResetPassword : { screen: ResetPassword},
  },
  {
    initialRouteName: 'HomeScreen',
    gesturesEnabled: true,
    contentComponent: props => <DrawerModel {...props} />
  },
);

和代码StarStack是

const StarStack = createStackNavigator({
  Buy : { screen: BuyStars},
  PaymentMode : { screen: PaymentMode},
 }, {
  headerMode: 'none',
  initialRouteName: 'Buy'
 });

现在在抽屉内导航时，我想将堆栈清除到位置 0。

<TouchableOpacity
  onPress={() => {
    this.props.navigation.navigate('BuyStar');
    const resetAction = StackActions.reset({
      index: 0,
      actions: [NavigationActions.navigate({ routeName: 'Buy' })],
    });
    this.props.navigation.dispatch(resetAction);
  }}
>
  <Text style={styles.drawertext}>Buy Stars</Text>
</TouchableOpacity>

上面的代码是产生错误的原因

No route defined for key 'Buy',Must be one of 'Splash','EnterOtp' etc.

我被困在这种情况下。请帮我解决这个问题。提前致谢 。

标签： react-native

解决方案

似乎问题在于您的代码正在尝试导航根导航器（Splash并且EnterOp都是此导航器上的两个键）。根据文档：

key - 字符串或 null - 可选 - 如果设置，具有给定键的导航器将重置。如果为 null，则根导航器将重置。

因此，也许您可​​以尝试将key参数添加到您的reset操作中：

const resetAction = StackActions.reset({
  index: 0,
  actions: [NavigationActions.navigate({ routeName: 'Buy' })],
  key: 'BuyStar',
});

以下是一些可能有帮助的资源：

所以回答

Github问题

请注意，实现可能取决于您使用的是 React Navigation 3.0+ 还是早期版本之一。

编辑

提供的键应该是BuyStar- 您正在尝试导航到导航器Buy中存在的路线StarStack。导航器StarStack位于抽屉式导航器中，因此在其键中可以找到此导航器的键：

const modeldrawerNavigator = createDrawerNavigator({
  ...
  BuyStar : { screen: StarStack },
  ...

键应该是包含您尝试导航到的路线的导航器的 ID。

推荐阅读