Criando rota para 404
Para criar uma página “Page Not Found” com React Router DOM, você pode utilizar o componente <Route>
para capturar todas as rotas não encontradas e exibir a página de erro 404.
import { BrowserRouter, Routes, Route } from 'react-router-dom';
function App() {
return (
<BrowserRouter>
<Routes>
<Route path="/" element={<About />} />
<Route path="/about" element={<About />} />
<Route path="*" element={<PageNotFound />} />
</Routes>
</BrowserRouter>
);
}
Neste exemplo, o componente <Routes>
renderiza o primeiro filho <Route>
que corresponde à localização atual. Se nenhum <Route>
corresponder, o componente com o path="*"
será renderizado. Isso torna o componente PageNotFound
a página exibida quando nenhuma outra rota for encontrada.