react hooks 返回上一页不刷新上一页的页面

在 React Hooks 中返回上一页并不会刷新上一页的页面，这是 react-router-dom 库的默认行为。如果你需要在返回上一页时刷新上一页的页面，可以通过以下几种方式实现：

1. 在返回上一页时手动刷新页面。可以使用 JavaScript 提供的 `location.reload()` 方法来刷新页面。具体来说，可以在需要返回上一页的事件处理函数中先调用 `history.goBack()` 方法，然后再调用 `location.reload()` 方法来刷新页面。

import { useHistory } from 'react-router-dom';

function MyComponent() {
  const history = useHistory();

  function handleGoBack() {
    history.goBack();
    window.location.reload();
  }

  return (
    <div>
      <button onClick={handleGoBack}>返回上一页</button>
    </div>
  );
}

2. 使用路由参数来判断是否需要刷新页面。可以在路由跳转时传递一个参数，然后在上一页的组件中监听该参数的变化，如果参数发生了变化，则手动刷新页面。具体来说，可以在需要返回上一页的组件中通过 `history.push()` 方法传递一个参数，然后在上一页的组件中通过 `useEffect()` 钩子函数监听该参数的变化，如果参数发生了变化，则调用 `location.reload()` 方法来刷新页面。

import { useEffect } from 'react';
import { useHistory } from 'react-router-dom';

function PreviousComponent() {
  useEffect(() => {
    if (location.state && location.state.forceRefresh) {
      window.location.reload();
    }
  }, []);

  return (
    <div>
      <h1>上一页</h1>
    </div>
  );
}

function MyComponent() {
  const history = useHistory();

  function handleGoBack() {
    history.push({
      pathname: '/previous-page',
      state: {
        forceRefresh: true
      }
    });
  }

  return (
    <div>
      <button onClick={handleGoBack}>返回上一页</button>
    </div>
  );
}

需要注意的是，手动刷新页面可能会导致用户的操作数据丢失，因此需要谨慎使用。建议在需要刷新页面时给出提示并允许用户确认。