react-navigation 监听返回

在 react-navigation 中，我们可以通过添加监听器来监听返回操作。具体步骤如下：

1. 导入 `useFocusEffect` 和 `useNavigation` 钩子：

import { useFocusEffect, useNavigation } from '@react-navigation/native';

2. 在组件中使用 `useNavigation` 钩子获取导航对象：

const navigation = useNavigation();

3. 在 `useFocusEffect` 钩子中添加返回监听器：

useFocusEffect(
  React.useCallback(() => {
    const onBackPress = () => {
      // 处理返回逻辑
      return true; // 返回 true 表示阻止默认行为，返回 false 则不影响默认行为
    };

    navigation.addListener('beforeRemove', onBackPress);

    return () => {
      navigation.removeListener('beforeRemove', onBackPress);
    };
  }, [navigation])
);

在上面的代码中，我们在 `useFocusEffect` 钩子中添加了返回监听器，使用 `addListener` 方法注册监听器。在监听器回调函数中，我们可以处理返回逻辑，返回 `true` 表示阻止默认行为，返回 `false` 则不影响默认行为。最后，使用 `removeListener` 方法在组件销毁时移除监听器，避免内存泄漏。