How do I implement redirects in React Router DOM?

How do I implement redirects in React Router DOM?

You can use the <Navigate> component for redirects in React Router DOM. Just wrap it in your route.

Can you show me an example of how to use the <Navigate> component?

Sure! Here's a simple example:

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

function App() {
  return (
    <Router>
      <Routes>
        <Route path="/old-path" element={<Navigate to="/new-path" replace />} />
        <Route path="/new-path" element={<NewComponent />} />
      </Routes>
    </Router>
  );
}

What does the replace prop do in the <Navigate> component?

The replace prop prevents the new entry from being added to the history stack, so the user can't go back to the old path.