Question

我正在做一个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.

我陷入这种情况。请帮助我解决此问题。预先感谢。

Answer 1

问题似乎出在您的代码正在尝试浏览根导航器（Splash和EnterOp都是该导航器上的键）。根据{{3}}：

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

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

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

这里有一些其他资源可能会有所帮助：

docs

SO answer

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

编辑

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

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

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

在React Native中没有在堆栈导航器中找到键的路由

1 个答案: