logo标签列表

如何退出/关闭React Native应用程序？

reactjsnativereact-native
70
如果我的React Native应用程序无法连接其后端，我会显示一个带有“确定”按钮的警告框。如果发生这种情况，继续运行应用程序毫无意义，因此我希望在点击按钮时关闭它。我该如何做到这一点？
我怀疑关键在于AppRegistry，但文档有点不足。
9个回答
114

对于Android系统，使用BackHandler来退出应用程序：

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

BackHandler.exitApp();
13
BackAndroid 已被废弃，推荐使用 BackHandler（请参见 https://facebook.github.io/react-native/docs/backhandler.html）。在更新代码时，请注意更换。 - Bataleon
19
注意：对于那些希望真正“停止”他们的应用程序的人来说，这并不会“停止”应用程序，也不会停止进程的运行。该应用程序仍在后台运行，并且用户将返回到“桌面”。 - lance.dolan
8
是的，它不会停止应用程序。 - Supermacy
它有助于 Android 端 :) - Hardik Desai
1
那iOS呢？BackHandler只在Android上起作用。 - instanceof
49

我回答这个问题有点晚，但我认为我选择的方法可能对某些人有所帮助，因此我还是要回答这个问题。

componentWillMount() {
   BackHandler.addEventListener('hardwareBackPress', this.backPressed);
}

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

backPressed = () => {
  Alert.alert(
    'Exit App',
    'Do you want to exit?',
    [
      {text: 'No', onPress: () => console.log('Cancel Pressed'), style: 'cancel'},
      {text: 'Yes', onPress: () => BackHandler.exitApp()},
    ],
    { cancelable: false });
    return true;
}
这是正确的答案!!! 它完全按照预期工作。 - Patrissol Kenfack
有什么想法可以用钩子来实现这个？ - Donia El Fouly
24

今天还没有特定于React Native的方法来实现此操作。您需要从本地端完成此操作。

此外，您是为iOS开发吗？苹果已经声明应用程序不应该关闭自己。

1
这是一个Android应用程序，但谢谢，也许我只需将“确定”按钮更改为“重试”按钮，让用户自行尝试重新连接或退出。感谢您帮我避免了使用AppRegistry进行实验的麻烦。 :) - Nolan
1
虽然没有现成的react-native方法来实现这一点，但有一个适合于react-native的解决方案：请参见下面我的答案，了解如何实现一个本地模块/函数来关闭Android和iOS应用程序... - WiRa
21
4
注意：所引用的库采用GPLv3许可证（当软件被分发时必须提供源代码）。 - Jessy
我知道这可能会成为某些项目的问题......事实上，我正在考虑在下一个版本中将我的项目重新授权为MIT许可证。无论如何，该项目中没有比我上面回答的更多的本地代码，因此人们可以轻松地实现自己的模块。(只是想尽可能地鼓励开源) - WiRa
2
这里有一个 MIT 版本：https://www.npmjs.com/package/react-native-close-app - sudo
@sudo有没有关于react-native-exit-app和react-native-close-app无法将应用程序从后台任务列表中移除的更新？ - Sagar
@Sagar哦，那是很久以前的事了，我不记得我最终是否使用了它。但至少在iOS上，我认为没有办法让应用程序从应用切换器中删除自己。我认为即使它崩溃了，它仍然会存在，并且如果用户切换到它，它将重新初始化。 - sudo
9
这就是我实现它的方法：
  componentWillMount() {
    BackHandler.addEventListener('hardwareBackPress', this.handleBackButtonClick);
  }
  componentWillUnmount() {
    BackHandler.removeEventListener('hardwareBackPress', this.handleBackButtonClick);
  }
  handleBackButtonClick() {
    BackHandler.exitApp();
    return true;
  }
8

这个npm模块帮助我解决了相同的问题 - react-native-exit-app

import RNExitApp from 'react-native-exit-app';
...
RNExitApp.exitApp();
...
2
我正在使用相同的东西，但它会使应用保持在后台任务中，不会被杀死。你有什么想法吗？ - Sagar
可以尝试使用npm i https://github.com/SaeedZhiany/react-native-exit-app/tree/patch-1 -S命令。在while循环中，使用BackHandler.exitApp()和RNExitApp.exitApp()来退出应用程序。 - johndpope
2

仅适用于Android 返回键退出


import { BackHandler } from "react-native";

useEffect(() => {
  BackHandler.addEventListener("hardwareBackPress",()=>{
    BackHandler.exitApp();
  });
}, []);
你的回答可以通过提供更多支持信息来改进。请编辑以添加进一步的细节，例如引用或文档，以便他人可以确认你的答案是正确的。您可以在帮助中心中找到有关如何编写良好答案的更多信息。 - Community
1
// only works for android

import React, { useEffect } from 'react';
import { BackHandler } from 'react-native';

useEffect(() => {
  setTimeout(() => {
     BackHandler.exitApp();
  }, 2000);
}, []);
虽然这段代码片段可能是解决方案，但包括解释真的有助于提高您的帖子质量。请记住，您正在回答未来读者的问题，而这些人可能不知道您的代码建议原因。 - Shawn Hemelstrand
有任何 iOS 的解决方案吗？ - famfamfam
0

你可以在和上都通过抛出异常来关闭应用程序：

const exitApp = () => {
  throw {};
}

这会在调试模式下显示错误，但在生产模式下，应用程序将因崩溃而自动退出

我喜欢这个想法，但是它会如何影响应用程序呢？ - jewishmoses
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接