You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

React Native中如何实现从指定页面按安卓返回键直接退出应用?

原因说明

navigation.replace 仅会替换路由栈的顶层页面,不会清除下层栈元素。你调用该方法从screen2跳转screen3时,原路由栈 [screen1, screen2] 会被修改为 [screen1, screen3],因此在screen3触发返回操作时,会回到下层的screen1,和预期不符。

解决方案
  • 方案1:使用reset方法清空路由栈,仅保留screen3为根页面
    执行后路由栈变为 [screen3],触发返回时栈为空就会直接退出应用,是最符合需求的方案:
    props.navigation.reset({
      index: 0,
      routes: [{ name: 'screen3' }]
    })
    
  • 方案2:组合使用popToTop和replace实现
    先回到路由栈底层的screen1,再将screen1替换为screen3,效果和方案1一致:
    props.navigation.popToTop()
    props.navigation.replace('screen3')
    
  • 方案3:在screen3页监听安卓返回键,手动触发退出
    不需要修改原有跳转逻辑,仅在screen3页拦截返回事件直接退出应用:
    import React from 'react'
    import { BackHandler } from 'react-native'
    import { useFocusEffect } from '@react-navigation/native'
    
    // screen3组件内添加逻辑
    useFocusEffect(
      React.useCallback(() => {
        const handleBackPress = () => {
          BackHandler.exitApp()
          return true // 拦截默认返回逻辑
        }
        BackHandler.addEventListener('hardwareBackPress', handleBackPress)
        return () => BackHandler.removeEventListener('hardwareBackPress', handleBackPress)
      }, [])
    )
    

内容的提问来源于stack exchange,提问作者user14877357

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.09.25 16:06:03