React Navigation v5 不会重置和删除以前的路线答案

【问题标题】：React Navigation v5 won't reset and remove previous routesReact Navigation v5 不会重置和删除以前的路线
【发布时间】：2020-06-13 10:10:43
【问题描述】：

我有一个已放入堆栈的登录屏幕。用户成功登录后，他被重定向到主屏幕，这是一个抽屉屏幕。抽屉屏幕的选项之一是注销，因此单击它的用户应该注销。以下是我的注销屏幕代码。我只是在 ui 中显示注销屏幕的进度条，但在 useEffect 钩子中，我正在调用以下方法

navigation.navigate({index: 0, routes: [{name: LOGIN_SCREEN}]});

但我收到一条错误消息You need to specify name or key when calling navigate with an object as the argument，然后我被重定向到主屏幕。当我完全重新启动我的应用程序时，它只会移动到登录屏幕。我正在为 name 键传递正确的值。

我的导航堆栈如下所示

 <Stack.Navigator>

      <Stack.Screen
        name={LOGIN_SCREEN}
        component={LoginScreen}
        options={{headerShown: false}}
      />
     <Stack.Screen
        name={HOME_STACK_SCREEN}
        component={DrawerStack}
        options={{headerShown: false}}
      />...

我的抽屉组件如下

<Drawer.Navigator
      drawerStyle={{backgroundColor: BLUE_COLOR_1}}
      drawerContentOptions={{labelStyle: {color: '#FFF'}}}>
      <Drawer.Screen
        name={HOME_SCREEN}
        component={Home}
        options={{
         ...
        }}
      />
     <Drawer.Screen
        name={LOGOUT_SCREEN}
        component={Logout}
        options={{
         ...
        }}
      />

【问题讨论】：

您如何通过重置从登录堆栈导航到抽屉？

标签： react-native react-navigation-v5

【解决方案1】：

如果要重置则需要使用reset，而不是navigate：

navigation.reset({
  routes: [{ name: LOGIN_SCREEN }]
});

【讨论】：

感谢您的回答，但我收到一个对话框，说不变量违规。用重置替换导航后超出最大深度
这可能与github.com/react-navigation/hooks/issues/35有关
LOGIN_SCREEN 应该用引号引起来
取决于是变量还是字符串，是OP中的变量

【解决方案2】：

在反应导航 v5 中。您可以像这样重置导航

import { CommonActions } from "@react-navigation/native";

this.props.navigation.dispatch(
     CommonActions.reset({
        index: 0,
        routes: [{ name: "LOGIN_SCREEN" }],
    })
);

【讨论】：