React Native Android端有Token时返回直接退出不进入登录页

问题根源 #

登录成功后用navigate跳转到Tab页面时，登录页仍保留在导航栈中，导致按下返回键会回退到登录页。要实现有Token时返回键直接关闭应用，需要从导航栈清理和返回键拦截两方面处理。

解决方案 #

1. 登录成功后重置导航栈，替换为Tab页 #

把登录成功后的navigate改为reset，直接将Tab页设为导航栈的根页面，彻底移除登录页：

修改你onSubmit函数里的导航代码：

// 替换原setTimeout内的navigate逻辑
setTimeout(() => {
  props.navigation.reset({
    index: 0,
    routes: [{ name: SCREEN.tab }],
  });
}, 600);

2. 在Tab导航器根页面拦截返回键 #

在Tab导航器所在的组件（比如Tab导航器的父组件或Tab首页）中，监听Android返回键，判断Token存在时直接关闭应用：

import { BackHandler, useEffect } from 'react-native';
import { useSelector } from 'react-redux'; // 假设你用Redux存储Token状态

const TabRootScreen = () => {
  const token = useSelector(state => state.auth.token); // 根据你的Redux结构调整取值路径

  useEffect(() => {
    const handleBackPress = () => {
      if (token) {
        // 存在Token时直接关闭应用
        BackHandler.exitApp();
        return true; // 阻止默认返回行为
      }
      return false; // 无Token时允许默认返回逻辑
    };

    const backListener = BackHandler.addEventListener(
      'hardwareBackPress',
      handleBackPress
    );

    return () => backListener.remove();
  }, [token]);

  return <TabNavigator />; // 你的Tab导航器组件
};

补充说明 #

• 确保能正确获取Token状态（比如从Redux、Keychain或全局状态中读取）
• BackHandler.exitApp()是React Native提供的Android专属关闭应用方法
• 重置导航栈后，Tab页成为栈内唯一页面，即使不拦截返回键，默认行为也是退出应用；加上拦截逻辑能更稳妥处理边界场景

内容的提问来源于stack exchange，提问作者Alperen Kapusuz