reactnavigation 怎么重置头部的返回事件

可以使用 navigation.setOptions 方法来重置头部的返回事件。具体步骤如下：

在组件中引入 useEffect 和 useLayoutEffect 钩子函数。

import React, { useEffect, useLayoutEffect } from 'react';

在组件中使用 useLayoutEffect 钩子函数来设置头部的返回事件。

useLayoutEffect(() => {
  navigation.setOptions({
    headerLeft: () => (
      <TouchableOpacity onPress={() => {
        // 重置返回事件
      }}>
        <Icon name="arrow-back" size={24} color="#fff" />
      </TouchableOpacity>
    ),
  });
}, [navigation]);

在返回事件中使用 navigation.goBack() 方法来实现返回上一页的功能。

onPress={() => {
navigation.goBack();
}}

完整代码

import React, { useEffect, useLayoutEffect } from 'react';
import { TouchableOpacity } from 'react-native';
import Icon from 'react-native-vector-icons/MaterialIcons';

function MyScreen({ navigation }) {
  useLayoutEffect(() => {
    navigation.setOptions({
      headerLeft: () => (
        <TouchableOpacity onPress={() => {
          navigation.goBack();
        }}>
          <Icon name="arrow-back" size={24} color="#fff" />
        </TouchableOpacity>
      ),
    });
  }, [navigation]);

  return (
    // ...
  );
}

export default MyScreen;