How to get data from url in react

Question

For example i redirected in my spa on localhost:3000/ProductPage/014 How can i take '014' value to my react variable?

      <Route exact
        path="/ProductPage/:id"
        render={() => <ProductPage data={data} />}
      />

[`useParams()`](https://reacttraining.com/react-router/web/api/Hooks/useparams). — zero298, Feb 27 '20 at 17:38
Does this answer your question? [react-router - pass props to handler component](https://stackoverflow.com/questions/27864720/react-router-pass-props-to-handler-component) — Natixco, Feb 27 '20 at 17:46

score 6 · Answer 1 · answered Feb 27 '20 at 18:03

6

Assuming you are using react-router-dom, You can use useParams().

import {
  useParams
} from "react-router-dom";

then in your component ->

let { id } = useParams();

For more detailed example you can see this

answered Feb 27 '20 at 18:03

Henok Teklu

I just take it using it: window.location.href – Денис Босый Feb 27 '20 at 18:41
that works, but if you have a more complicated route, like `users/:user_id/posts/post_id`, it would be more difficult to extract the values – Henok Teklu Feb 27 '20 at 19:18

1 Answers1