已解决：反应路由器 404 重定向

与 React Router 404 重定向相关的主要问题是它可能难以实现。 由于 React Router 没有内置的 404 页面，开发人员必须手动为 404 页面创建路由，然后配置路由器以重定向任何与现有路由不匹配的请求。 这需要额外的代码和配置，如果出现问题，这可能非常耗时且难以调试。 此外，如果用户直接导航到不存在的 URL，他们仍然会看到错误页面，而不是被重定向到 404 页面。

import { BrowserRouter as Router, Route, Switch } from "react-router-dom";

const App = () => (
  <Router>
    <Switch>
      <Route exact path="/" component={Home} />
      <Route exact path="/about" component={About} />

      {/* 404 Redirect */}
      <Route render={() => (<Redirect to="/" />)} /> 

    </Switch>
  </Router>  
);

// 第 1 行：此行从 react-router-dom 库中导入 BrowserRouter、Route 和 Switch 组件。

// 第 3 行：这一行定义了一个名为 App 的函数，它返回 JSX。

// 第 5-7 行：这些行将 App 组件包装在来自 react-router-dom 的 Router 组件中。

// 第 8-10 行：这些行分别为 Home 和 About 组件定义了两条路由。

// 第 12 行：此行定义了一个路由，如果没有其他路由匹配，则重定向到主页。

什么是 404 错误代码

React Router 中的 404 错误代码是一种 HTTP 状态代码，表示无法找到所请求的资源。 它通常在用户试图访问不存在的页面或路由时返回。 如果用户输入错误的 URL，或者如果页面已被删除或移动而没有更新指向它的链接，就会发生这种情况。 发生这种情况时，React Router 将显示一个通用的 404 页面，其中包含一条适当的消息，通知用户他们的错误。

404重定向

在 React Router 中，404 重定向是一种在用户尝试访问无效 URL 时将用户重定向到不同页面的方法。 这有助于在用户输入错误的 URL 或尝试访问不存在的页面时为他们提供更好的体验。 404 重定向可以使用 React Router 的 Redirect 组件实现，它允许您指定要将用户重定向到的页面的路径名。 例如，如果有人试图访问 /invalid-url，您可以像这样使用重定向组件：