react怎么刷新当前页面

在 React 中刷新当前页面可以通过以下几种方式实现：

1. 使用 JavaScript 的 window.location.reload() 方法来刷新当前页面。例如：

function refreshPage() {
  window.location.reload();
}

<button onClick={refreshPage}>刷新页面</button>

2. 使用 React Router 的 useHistory 钩子来刷新当前页面。首先导入 useHistory 钩子，然后调用 history.go(0) 方法来刷新页面。例如：

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

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

  function refreshPage() {
    history.go(0);
  }

  return (
    <button onClick={refreshPage}>刷新页面</button>
  );
}

3. 使用状态管理工具（如 Redux）来刷新当前页面。在 Redux 中，可以创建一个 action，然后在点击按钮时调用该 action 来刷新页面。例如：

// 在 actions.js 中
export const refreshPage = () => ({
  type: 'REFRESH_PAGE',
});

// 在 reducer.js 中
const initialState = {
  pageRefreshed: false,
};

const reducer = (state = initialState, action) => {
  switch (action.type) {
    case 'REFRESH_PAGE':
      return {
        ...state,
        pageRefreshed: true,
      };
    default:
      return state;
  }
};

// 在组件中使用
import { connect } from 'react-redux';
import { refreshPage } from './actions';

function MyComponent({ pageRefreshed, refreshPage }) {
  function handleRefreshPage() {
    refreshPage();
  }

  if (pageRefreshed) {
    window.location.reload();
  }

  return (
    <button onClick={handleRefreshPage}>刷新页面</button>
  );
}

const mapStateToProps = (state) => ({
  pageRefreshed: state.pageRefreshed,
});

const mapDispatchToProps = {
  refreshPage,
};

export default connect(mapStateToProps, mapDispatchToProps)(MyComponent);

以上是几种在 React 中刷新当前页面的方法，根据具体情况选择适合的方式来实现。