react-router-domV6怎么获取返回页面时的来源路径?

在 React Router v6 中，你用 useLocation 和 usePrevious 自定义 Hook 来获取返回页面时的来源路径。useLocation 是 React Router v6 提供的一个 Hook，可以用来获取当前页面的路由信息。usePrevious 是一个自定义的 Hook，可以用来存储上一个状态值。

首先你，创建一个 usePrevious 自定义 Hook：

import { useRef, useEffect } from 'react';

function usePrevious(value) {
  const ref = useRef();

  useEffect(() => {
    ref.current = value;
  }, [value]);

  return ref.current;
}

然后，在您需要获取来源路径的组件中，使用 useLocation 和 usePrevious Hook：

import { useLocation } from 'react-router-dom';
import usePrevious from './usePrevious'; // 导入自定义的 usePrevious Hook

function YourComponent() {
  const location = useLocation();
  const prevLocation = usePrevious(location);

  useEffect(() => {
    if (prevLocation) {
      console.log('From:', prevLocation.pathname);
      console.log('To:', location.pathname);
    }
  }, [location, prevLocation]);

  
}

这样，每当路由发生变化时，useEffect 将会触发并输出来源路径（from）和目标路径（to）。当用户点击浏览器的返回按钮时，你就可以看到相应的来源路径。