跳到主要内容

BackHandler

Backhandler API 用于检测硬件返回按钮的按下操作,允许你为系统的返回操作注册事件监听器,并控制你的应用如何响应。它仅适用于 Android 平台。

事件订阅会以相反的顺序被调用(即最后注册的订阅会首先被调用)。

  • 如果一个订阅返回 true,则更早注册的订阅将不会被调用。
  • 如果没有订阅返回 true,或者没有注册任何订阅,它将以编程方式调用默认的返回按钮功能来退出应用。

模态框用户请注意:如果你的应用显示一个已打开的 Modal,BackHandler 将不会发布任何事件(请参阅 Modal 文档)。

模式

tsx
const subscription = BackHandler.addEventListener(
'hardwareBackPress',
function () {
/**
* this.onMainScreen and this.goBack are just examples,
* you need to use your own implementation here.
*
* Typically you would use the navigator here to go to the last state.
*/

if (!this.onMainScreen()) {
this.goBack();
/**
* When true is returned the event will not be bubbled up
* & no other back action will execute
*/
return true;
}
/**
* Returning false will let the event to bubble up & let other event listeners
* or the system's default back action to be executed.
*/
return false;
},
);

// Unsubscribe the listener on unmount
subscription.remove();

示例

以下示例实现了一个场景,在该场景中,你需要确认用户是否想要退出应用

BackHandler.addEventListener 创建一个事件监听器并返回一个 NativeEventSubscription 对象,该对象应使用 NativeEventSubscription.remove 方法清除。

与 React Navigation 一起使用

如果你正在使用 React Navigation 在不同屏幕之间导航,你可以参考他们关于 自定义 Android 返回按钮行为 的指南

Backhandler Hook

React Native Hooks 提供了一个方便的 useBackHandler Hook,它将简化设置事件监听器的过程。


参考

方法

addEventListener()

tsx
static addEventListener(
eventName: BackPressEventName,
handler: () => boolean | null | undefined,
): NativeEventSubscription;

exitApp()

tsx
static exitApp();