Use url parameters in `@reach/router`

Sara Vieira
InstructorSara Vieira
Share this video with your friends

Social Share Links

Send Tweet

In this lesson, we will add url parameters to our application using the @reach/router library.

We will use the example of getting the username prop from our location to greet a user.

Instructor: [00:00] Let me just add a user component. This is going to say "Hello," because I don't have the username yet. I'm going to say "Hello" and I'm going to close this H1 and then we're going to see how we can add this parameter.

[00:14] Let me do the same thing I have in here. I want to say "user." The path of this is going to be users/username. Let me add a link that is going to go to users/sarah, and this is Sarah. If I do this now, this one's going to say "Hello." To get the props here, I can say props and then I can say props.username.

[00:46] If I do this it now says "Hello Sarah." This is how you can add URL parameters using Reach Router.