react-native - React Native-设备后退按钮处理

我想检查单击设备后退按钮时是否有多个屏幕在堆栈上。如果是，我想显示上一个屏幕，如果不是，我想退出应用程序。

我检查了一些示例，但这些示例使用BackAndroid和Navigator。但是它们两个都已弃用。 BackHandler替代了BackAndroid。我可以使用props.navigation.goBack(null)显示上一个屏幕。

但是我找不到用于在堆栈中查找屏幕计数的代码。我不想使用已弃用的Navigator!

最佳答案

此示例将向您显示大多数流中通常期望的向后导航。您必须根据预期的行为在每个屏幕上添加以下代码。有两种情况:
1.如果堆栈上有多个屏幕，设备后退按钮将显示上一屏幕。
2.如果堆栈上只有一个屏幕，则设备后退按钮将退出应用程序。

情况1:显示上一个屏幕

import { BackHandler } from 'react-native';

constructor(props) {
    super(props)
    this.handleBackButtonClick = this.handleBackButtonClick.bind(this);
}

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

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

handleBackButtonClick() {
    this.props.navigation.goBack(null);
    return true;
}

重要提示:不要忘记在构造函数中绑定(bind)方法并在componentWillUnmount中删除侦听器。

情况2:退出应用

在这种情况下，无需处理要退出应用程序的屏幕上的任何内容。

重要提示:这应该只是堆栈上的屏幕。

关于react-native - React Native-设备后退按钮处理，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/45031085/