react-navigation v2后退按钮关闭应用程序

Question

我的应用程序正常运行时遇到了一个非常奇怪的问题，升级到 react-navigation v2 后，该应用程序开始出现问题。

应用程序中的任何位置，Android上的后退按钮都会关闭该应用程序，并将其移回已暂停的应用程序。

我已经尝试了许多方法来手动处理后退行为，降级某些软件包等，但是它们都不起作用。

这是我的package.json文件：

Answer 1

我遇到了同样的问题，这些是我发现的： https://github.com/react-navigation/react-navigation/issues/4329 和 https://github.com/expo/expo/issues/1786

提到了一个临时解决方案，它将Firebase降级到5.0.3，这对我有用。

Answer 2

问题出在npm firebase软件包中。有两种方法可以解决此问题。

1. 如其他答案所述，将Firebase降级为5.0.3

2. 更改导入Firebase的方式。这种方法会很多 更轻松。 使用：

   configurations.all

   请勿使用 import firebase from "@firebase/app"; import "firebase/auth"; import "firebase/database"; 或import * as firebase from "firebase";

有关更多详细信息，请参见this GitHub issue。

Answer 3

降级Firebase的解决方案也对我有用，但是我不得不降级到Firebase 4.13.1，因为与5.0.3一样，我仍然面临这个问题。

Answer 4

如果您正在使用react-navigation v2，请查看this documentation。

您也可以使用react-navigation-backhandler作为易于使用的解决方案。

Answer 5

转换此导入语句解决了我的问题

import Firebase from '@firebase/app' // The issue got fixed after adding @
import 'firebase/auth'
import 'firebase/database'
import 'firebase/storage'

没有@的后退按钮正在使用户退出应用程序

Answer 6

我遇到了同样的问题，似乎Backhandler.android.js的实现不正确，您可以在此处找到文件 node_modules / react-native / Libraries / Utilities / BackHandler.android.js < / strong>，在此文件中const subscriptions = Array.from（_backPressSubscriptions.values（））。reverse（）;这段代码始终返回长度为0的数组，这就是为什么invokeDefault变量始终保持为true并关闭应用程序的原因，您可以通过自己的实现通过处理后退按钮的行为来对其进行修复。

在导航服务中添加此方法

def calculate_foo(bar):
    return bar + 3

bar = 5
foo = calculate_foo(bar)  # 8

bar = 8
foo = calculate_foo(bar)  # 11

您需要在app.js中设置顶级导航器，例如此int渲染方法的return语句

import { NavigationActions, StackActions } from 'react-navigation';*

let navigator;
  function setTopLevelNavigator(navigatorRef) {
    navigator = navigatorRef; 
  }

  function pop() {
    navigator.dispatch(StackActions.pop());
  }

    export default {
     pop,
     setTopLevelNavigator
  };

要处理“后退”按钮功能，请在app.js中添加这些内容

也导入NavigationService

<AppNavigator //Replace it with your navigator
        ref={navigatorRef => {
          NavigationService.setTopLevelNavigator(navigatorRef);
        }}
        onNavigationStateChange={(prevState, currentState) => {
          this.setState({ currentState });
        }}
/>

在componentDidMount中添加这些

import {
 BackHandler,
 DeviceEventEmitter
} from 'react-native';

在componentWillUnmount中添加这些

  componentDidMount() {
   BackHandler.addEventListener('hardwareBackPress', this.handleHardwareBack);
  }

现在正在处理硬件后退按钮

componentWillUnmount() {
 BackHandler.removeEventListener('hardwareBackPress',this.handleHardwareBack);
}

返回true表示我们将手动处理后退按钮功能，返回false将导致退出应用程序，因为默认情况下，它是“硬件后退”按钮关闭应用程序：（

希望这对您有帮助

Answer 7

好吧，我正在使用Firebase 5.5.5，导航没有任何问题，我认为您需要创建堆栈导航器才能正确使用后背按钮，我已举了一个例子。页面也被导入，我还没有附加屏幕导入代码

import { createSwitchNavigator, createStackNavigator } from 'react-navigation';

  const Drawer = createDrawerNavigator(
    {
        BrowseQuestion: BrowseQuestion,
        BrowseCategory: BrowseCategory,

    }

  );

  const Loginstack = createStackNavigator({
    Login: LoginScreen,
    Forgot: ForgotPassword,
    Signup: SignupScreen,
  })


  export default createSwitchNavigator({
    Login : Loginstack,
    Account: Drawer,
   },
   {
    initialRouteName: 'Login'
   }
  );