React Native中未删除事件侦听器

Question

我已经在主屏幕中注册了一个处理硬件后退按钮按下的事件。每当我在主屏幕中单击返回按钮时，它就会要求我提供退出确认警告框。我希望这种行为只发生在主屏幕中，而不发生在任何其他屏幕中。当我在其他屏幕中时，比如说设置屏幕，然后我单击后退按钮，它仍然会显示退出确认警报框。我在主屏幕上注册的事件似乎尚未删除。

const backAction = () => {
Alert.alert('Close the KhataBook app?', 'Are you sure you want to exit?', [
{
text: 'Cancel',
onPress: () => null,
style: 'cancel',
},
{text: 'YES', onPress: () => BackHandler.exitApp()},
]);
return true;
};
useEffect(() => {
const backHandler = BackHandler.addEventListener(
'hardwareBackPress',
backAction,
);
return () => backHandler.remove();
}, []);

Answer 1

使用removeEventListener方法，尝试像在文档中一样删除监听器

useEffect(() => {
BackHandler.addEventListener("hardwareBackPress", backAction);
return () =>
BackHandler.removeEventListener("hardwareBackPress", backAction);
}, []);

Answer 2

如果您使用的是react导航，您可以通过执行以下操作来实现：

useFocusEffect(() => {
const backHandler = BackHandler.addEventListener(
'hardwareBackPress', ()=>{ navigation.goBack(); return true; });
return () => {
backHandler.remove();
};
});