Question

我想在我的本机反应中处理后退按钮。我知道可以在componentdidmount和componentWillUnmount中使用addEventListener处理后退按钮。

我的问题是，该页面仍然存在于堆栈导航中，因此在其他页面中，我具有EventListener，但是我只希望EventListener放在一页上。

来自HOW TO EXIT REACT NATIVE APP ON BACK BUTTON PRESSED的以下示例代码无法解决问题。

Answer 1

可以很容易地包装您现在在屏幕上的组件。

import { AndroidBackHandler } from 'react-navigation-backhandler';
<AndroidBackHandler onBackPress={this.onBackButtonPressAndroid}>
    <SomeComponent />
</AndroidBackHandler>

Answer 2

在您的应用导航器中

ngsw-worker.js

Answer 3

您可以使用react-navigation的{{1}} HOC。

使用它，您可以在屏幕上知道是否聚焦。一个实现的示例是：

withNavigationFocus

别忘了用NavigationFocus和BackHandler导入：

componentDidMount=()=>{
    this.backHandler = BackHandler.addEventListener('hardwareBackPress', this.handleBackPress)
}

componentDidUpdate=(prevProps)=>{
     if (prevProps.isFocused !== this.props.isFocused) {
     this.props.isFocused ?
     this.backHandler = BackHandler.addEventListener('hardwareBackPress', this.handleBackPress):
     this.backHandler.remove()
     }
}

componentWillUnmount() {
     this.backHandler.remove()
}

您必须在导出中执行以下操作：

import { withNavigationFocus } from "react-navigation";
import { BackHandler } from "react-native";

我该如何处理本机中的后退按钮

3 个答案: