How do I use hooks in React Router v6?

How do I use hooks in React Router v6?

In React Router v6, you can use hooks like useNavigate, useLocation, and useParams to manage routing.

Can you give me an example of using useNavigate?

Sure! You can use useNavigate to programmatically navigate to a different route. For example:

const navigate = useNavigate();

const handleClick = () => {
  navigate('/home');
};

This will navigate to the '/home' route when handleClick is called.

What about useParams? How does that work?

useParams allows you to access URL parameters. For instance, if your route is defined as /user/:id, you can get the id like this:

const { id } = useParams();

This will give you the id from the URL.

Are there any other hooks I should know about?

Yes! Besides useNavigate and useParams, you can also use useLocation to get the current location object, which includes the pathname, search, and state.