发送404状态并重定向到react-router中的404组件

Question

我有一个带有NotFound组件的react-router 3.0.0设置,我将其作为后备显示:

<Route component={NotFound} path="*"/>

但是,这会返回重定向,Google抓取工具会抱怨软404.我可以重定向到我的NotFound组件并发送404,类似于Github的例子吗？我从这里尝试了以下建议:如何让路由器响应404状态代码？

<Route component={NotFound} path="*" status={404}/>

但这只是给了我404而没有显示组件.

如何实现上述目标？

Answer 1

反应路由器 v6

现场演示：使用 React Router 重定向默认或 404 路由

示例代码：

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

要重定向并导航到我们选择的路线之一，我们可以使用 React Router 中的组件。现在我们可以在路由配置下面声明空路由的情况，如下所示：

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