React Navigation V6：仅从特定页面返回时重新获取数据

下面提供几个简洁易维护的方案，替代繁琐的Redux标记方案：

方案一：跳转时传递标记参数，首页按需刷新 #

跳转到不需要触发刷新的第三个页面时，携带标记参数，首页获取焦点时判断该参数决定是否刷新。

// 跳转至第三个页面的代码
navigation.navigate('ThirdScreen', { skipRefresh: true });

首页使用useFocusEffect（React Navigation V6推荐的焦点监听API）处理逻辑：

import { useFocusEffect } from '@react-navigation/native';
import { useRoute } from '@react-navigation/native';
import React from 'react';

const HomeScreen = ({ navigation }) => {
  const route = useRoute();

  useFocusEffect(
    React.useCallback(() => {
      // 判断是否需要跳过刷新
      const shouldSkip = route.params?.skipRefresh;
      if (!shouldSkip) {
        fetchSomeData();
      }
      // 重置参数，避免下次焦点触发时误判
      route.params = {};
    }, [route.params])
  );

  // 其他页面跳转逻辑
  const goToFirstPage = () => navigation.navigate('FirstScreen');
  const goToSecondPage = () => navigation.navigate('SecondScreen');
  const goToThirdPage = () => navigation.navigate('ThirdScreen', { skipRefresh: true });

  return (
    // 页面渲染内容
  );
};

方案二：通过导航栈状态判断上一页面名称 #

直接读取导航栈的历史记录，判断上一个页面是否为第三个页面，无需额外传递参数。

import { useFocusEffect } from '@react-navigation/native';
import { useNavigationState } from '@react-navigation/native';
import React from 'react';

const HomeScreen = ({ navigation }) => {
  const navState = useNavigationState(state => state);

  useFocusEffect(
    React.useCallback(() => {
      // 获取导航栈中倒数第二个页面（即离开首页前访问的页面）
      const routes = navState.routes;
      const prevRoute = routes[routes.length - 2];
      
      // 仅当不是从ThirdScreen返回时，才刷新数据
      if (!prevRoute || prevRoute.name !== 'ThirdScreen') {
        fetchSomeData();
      }
    }, [navState])
  );

  // 页面跳转逻辑...
};

方案三：监听导航事件记录页面来源 #

通过beforeRemove事件记录离开首页时的目标页面，再在focus事件中判断是否需要刷新：

import { useEffect } from 'react';

const HomeScreen = ({ navigation }) => {
  let lastTargetScreen = null;

  useEffect(() => {
    // 监听离开页面的事件，记录目标页面
    const removeBeforeListener = navigation.addListener('beforeRemove', (e) => {
      lastTargetScreen = e.data.action.payload.name;
    });

    // 监听页面获取焦点的事件
    const focusListener = navigation.addListener('focus', () => {
      if (lastTargetScreen !== 'ThirdScreen') {
        fetchSomeData();
      }
      lastTargetScreen = null;
    });

    // 清理监听
    return () => {
      removeBeforeListener();
      focusListener();
    };
  }, [navigation]);

  // 页面跳转逻辑...
};

推荐优先使用方案一或方案二：方案一灵活性高，适合需要动态控制刷新规则的场景；方案二无需额外传参，代码更简洁，适合页面结构固定的场景。

内容的提问来源于stack exchange，提问作者AndrewHoover898