CODEWITHSUNDEEP
reactjsreact-router
Liondancer
Liondancer

Reputation: 16469

Instantly redirect to another URL when clicking different URL in ReactJS

Using reactjs and react-router, upon loading http://localhost:3000/data/abc123 in my browser (by clicking the URL sent to me), how can I send abc123 to the server and then instantly redirect to http://localhost:3000/game/? I'm not sure how to do so using react-router or where to start.

The use case of this is the user is sent a URL specific to them via email (http://localhost:3000/data/abc123 where abc123 is their unique ID). When this URL is clicked, abc123 is sent to the server, and the user is redirected to http://localhost:3000/game/ with their very own personal data based off of the server's response of abc123.

Upvotes: 0

Views: 64

Answers (1)

Celso Wellington
Celso Wellington

Reputation: 889

To do so, you can render <Redirect to={"http://localhost:3000/data?" + yourData } /> (you can access the value by the location object, provided by react router, be sure to use connect to get these data) then, in the route that will process the data, you deal with the data and then redirect using the same Redirect component (be sure to render to redirect the user)

you can also use an object instead of providing just the path

<Redirect
  to={{
    pathname: "/login",
    search: "?utm=your+face",
    state: { referrer: currentLocation }
  }}
/>

Here is some reference, happy coding! https://github.com/ReactTraining/react-router/blob/master/packages/react-router/docs/api/Redirect.md

Upvotes: 1

Related Questions