React Router v6如何实现重定向？Route的render属性报错怎么解决

问题原因 #

React Router v6 已经正式移除了Route组件的render、component属性，所有路由渲染逻辑统一使用element属性传入要渲染的组件实例。你遇到的类型报错就是因为v6的Route类型定义里根本不存在render字段。
之前的render属性是v5及更早版本的API，v6升级后已经废弃删除，不存在该用法。

正确实现方式 #

要实现所有未匹配路径重定向到首页，只需要给兜底路由设置path="*"匹配所有路径，直接在element属性中传入Navigate组件即可，建议加上replace参数避免重定向记录进入浏览器历史栈，防止用户点后退时反复触发重定向：

import { BrowserRouter, Navigate, Route, Routes } from 'react-router-dom';

<BrowserRouter>
  <Routes>
    <Route path="/" element={<Home />} />
    <Route path="/lab" element={<Lab />} />
    {/* 兜底匹配所有未命中的路由 */}
    <Route path="*" element={<Navigate to="/" replace />} />
  </Routes>
</BrowserRouter>

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