React Router v6 从Users跳转至Post失效、Redirect组件不工作求助

问题1：根路径Redirect重定向不生效 #

• React Router v6 已完全移除Redirect组件，替换为Navigate组件实现重定向逻辑
• 重定向需额外添加replace属性，避免向历史栈插入多余记录
• 根路径匹配建议明确写path="/"而非空字符串，匹配逻辑更严谨

修正后的根路由配置：

<Route path="/" element={<Navigate to="/users" replace />} />

问题2：Users页面跳转Post页面无响应 #

造成该问题的常见原因有两类，可逐一排查：

场景A：仍在使用v5的跳转API #

v6 废弃了useHistory Hook，替换为useNavigate实现编程式跳转：

• v5旧写法：

import { useHistory } from 'react-router-dom'
const history = useHistory()
// 跳转逻辑
history.push('/posts')

• v6新写法：

import { useNavigate } from 'react-router-dom'
const navigate = useNavigate()
// 跳转逻辑
navigate('/posts')

场景B：声明式跳转属性配置错误 #

检查Link组件的to属性拼写是否正确，绝对路径必须添加斜杠前缀：

<Link to="/posts">跳转到Posts页</Link>

完整修正后的路由配置 #

<Router>
  <Routes>
    <Route path="/users" element={<Users />} />
    <Route path="/posts" element={<Posts />} />
    <Route path="/" element={<Navigate to="/users" replace />} />
  </Routes>
</Router>

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