在react - native中更改抽屉导航器后，后退按钮处理程序在每个屏幕上工作

npm install @react-navigation/native

import { createDrawerNavigator } from '@react-navigation/drawer';

const Drawer = createDrawerNavigator();

function App() {
  return (
    <NavigationContainer>
      <Drawer.Navigator>
        {/* 配置抽屉导航器的屏幕 */}
        {/* Screen 1 */}
        {/* Screen 2 */}
        {/* Screen 3 */}
      </Drawer.Navigator>
    </NavigationContainer>
  );
}

export default App;

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

function Screen1() {
  const navigation = useNavigation();

  useFocusEffect(() => {
    const onBackPress = () => {
      // 处理后退按钮的逻辑
      // 返回上一个屏幕或关闭应用等
      return true; // 返回true表示已处理后退按钮事件
    };

    // 添加后退按钮处理程序
    BackHandler.addEventListener('hardwareBackPress', onBackPress);

    // 在组件卸载时移除后退按钮处理程序
    return () => BackHandler.removeEventListener('hardwareBackPress', onBackPress);
  });

  // 屏幕的渲染和其他逻辑

  return (
    // 屏幕的内容
  );
}

export default Screen1;