在本机反应中处理设备后退按钮

Posted 2023-04-13

【中文标题】在本机反应中处理设备后退按钮

【英文标题】：Handling device back button in react native

【发布时间】：2019-04-22 16:07:21

【问题描述】：

当我从登录页面导航到主页时，我正在使用主页中的 BackHandler 处理 React-Native 中的 android 后退按钮，它工作正常。但是，当我从主页转到第 2 页并通过单击设备返回按钮返回主页时，现在当我单击主页中的设备返回按钮时，它会将我带到登录页面，这不应该发生。 主页中使用的导航是抽屉式导航。 当我导航到 page2 时，我正在删除 backpress 事件处理程序，因为它也禁用了第 2 页中的后退按钮。

【问题讨论】：

您应该有两个堆栈，一个用于登录，另一个用于您的应用程序，并在登录时将堆栈重置为应用程序堆栈。这样您也不必担心向后滑动，并且您可以将后退按钮编程为实际工作，而不是禁用功能。

你能提供上面的示例吗

Here's a stripped down version of what I use。我正在使用redux 和redux-saga。这个特殊的 sn-p 来自使用 react-navigation ^1.0.0-beta.15

的应用程序

如何在 React Native 应用程序中从资源文件夹（如 drawable/mipmap）加载图像

你真的应该把它作为一个单独的问题发布。据我所知，你没有。即使可以，那也将是一种非常糟糕的编程习惯。从理论上讲，您可以创建一个 Native Module 来执行此操作，或者可能有人已经创建了。

【参考方案1】：

您只需要在您的主页中实现 Backhandler，不要对其执行任何操作。

  BackHandler.addEventListener('hardwareBackPress', () => 
                return false
            );

只返回false。所以它不会再次导航到登录屏幕。

【讨论】：

如何在 React Native 应用程序中从资源文件夹（如 drawable/mipmap）加载图像

您需要提供图像的路径。您需要在其中一个文件夹上添加图片，而不是特别是 ios 和 Android 文件夹。