反應路由器dom v6沒有重定向到未找到

Question

所以我剛剛從react-router-dom v5 遷移到 v6。

據我了解， exact不再存在，因為它被省略了。 但就我而言，它不起作用。

如果找不到路由，它應該重定向到not-found頁面，但無法弄清楚為什么它不工作。 它只是給我打印了一張白頁......

所以，這是我的 BrowerRouter：

<BrowserRouter>
    <Routes>
      <Route path="/" element={<Home />} />
      <Route path="/about" element={<AboutUs />} />
      <Route path="/contact" element={<Contact />} />
      <Route path="/publish-article" element={<WriteArticle />} />
      <Route path="/search-article" element={<Search />} />
      <Route path="/article/:id" element={<Article />} />
      <Route path="/quizz" element={<Quizz />} />
      <Route path="/login" element={<Login />} />
      <Route path="/register" element={<Register />} />
      <Route path="/profile/:username" element={<UserProfile />} />
      <Route path="/profile-settings" element={<ProfileSettings />} />
      <Route path="/not-found" element={<NotFound />} />
      <Route element={<NotFound />} />
    </Routes>
  </BrowserRouter>

有人知道我錯過了什么嗎？

Answer 1

您仍然需要為未找到的 Route 提供路徑，並將其作為通配符。

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

但是，如果您實際上希望 url 重定向到not-found ，那么只需將Navigate組件放在那里

import { Navigate } from 'react-router-dom'

<Route path="*" element={<Navigate to="not-found"/>} />

Answer 2

它可能不起作用，因為您缺少 Switch