How do I use React Router v6 with TypeScript?

How do I use React Router v6 with TypeScript?

To use React Router v6 with TypeScript, first install the necessary packages: react-router-dom and @types/react-router-dom.

What are the main differences between v5 and v6?

The main differences include a simplified API, the removal of Switch in favor of Routes, and improved nested routing.

Can you show me a basic example of routing?

Sure! Here's a simple example:

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

function App() {
  return (
    <Router>
      <Routes>
        <Route path='/' element={<Home />} />
        <Route path='/about' element={<About />} />
      </Routes>
    </Router>
  );
}

How do I handle route parameters?

You can handle route parameters by defining them in the path, like this:

<Route path='/user/:id' element={<User />} />

Then, use useParams to access the id in the User component.