时间戳

首页 > 解决方案 > 导航到登录屏幕后重置堆栈

react-native - 导航到登录屏幕后重置堆栈

问题描述

我正在制作一个 react-native 移动应用程序，我有一个导航抽屉，上面有一个注销按钮。我知道如何从那里导航到登录屏幕，使用props.navigation.navigate('Login')，但问题是如果用户这样做，他们仍然可以从登录屏幕打开抽屉并导航回其他屏幕之一，或按后退按钮在安卓上。

如果用户来自另一个页面然后禁用打开抽屉按钮，我想我可以在登录屏幕上进行检查，但这似乎有点 hacky。我想知道是否有正确的方法可以做到这一点，也许是在登录时重置堆栈，我不确定。

标签： react-nativereact-native-androidreact-navigation

解决方案

你的实现不好。根据您提供的详细信息，我认为您的所有页面都合二为一stack。我建议您将身份验证和应用程序堆栈分开。为此，我强烈推荐：https ://reactnavigation.org/docs/en/auth-flow.html

但重置堆栈：

重置

重置操作会擦除整个导航状态并将其替换为多个操作的结果。

  • index - number - required - 导航状态下路由数组上的活动路由索引。
  • actions - array - required - 将替换导航状态的导航操作数组。
  • key - 字符串或 null - 可选 - 如果设置，具有给定键的导航器将重置。如果为 null，则根导航器将重置。
import { StackActions, NavigationActions } from 'react-navigation';

const resetAction = StackActions.reset({
  index: 0,
  actions: [NavigationActions.navigate({ routeName: 'Profile' })],
});
this.props.navigation.dispatch(resetAction);

来源：https ://reactnavigation.org/docs/en/stack-actions.html

推荐阅读