user2465134 user2465134 - 2 months ago 23
React JSX Question

React Router - Read URL

I am trying to implement an invite system. A user will get an email with an invite link:

http://foo.com/accept?invitation=XXXXX&orgName=House%20of%20Grue


Basically, I need to pull the orgName out of the URL so I can use it as a variable on the page where they finalize their signup and I need to direct them to the correct page, foo.com/invite.

My route for this is:

const routes = <Route component={App}>
<Route path="/invite" component={Invite} />
</Route>;


Do I need to do anything different in my routes for when they click the link from their email?

I read that this.props.location.pathname will get me the URL and then I can slice it up from there. Is this the correct way?

Answer

this.props.location.query will give you an object whose key/value pairs are the query parameters.

For your example, this.props.location.query would provide you with;

{
    invitation: 'XXXXXX',
    orgName: 'House of Grue'
}
Comments