React 18 中使用 useNavigate 实现页面跳转与重定向-js教程

在 react router v6（适配 react 18）中，`withrouter` 和 `history.push()` 已被移除，推荐使用 `usenavigate` hook 进行编程式导航，支持跳转、重定向及替换历史记录等操作。

在 React 18 项目中集成 React Router v6 后，路由控制方式发生了根本性变化：旧版的 this.props.history.push() 或 withRouter HOC 不再可用，取而代之的是函数式、更轻量且更符合 React Hooks 设计理念的 useNavigate Hook。

✅ 正确用法：useNavigate

首先确保已安装并配置 react-router-dom@6+：

npm install react-router-dom

然后在组件中导入并调用 useNavigate：