I want to change my routing according to product id, which is dynamic.

I found this solution of variables using a colon.

path: "/:product_id" ponent: ProductDetail

How can I use product_id in my ponents.

I want to change my routing according to product id, which is dynamic.

I found this solution of variables using a colon.

path: "/:product_id" ponent: ProductDetail

How can I use product_id in my ponents.

• javascript
• reactjs
• react-native
• react-redux
• react-router

Share Improve this question Follow edited Jan 4, 2019 at 6:23 nem035 35.5k66 gold badges9292 silver badges104104 bronze badges asked Jan 4, 2019 at 6:19 rajatgalavrajatgalav 33911 gold badge66 silver badges2121 bronze badges

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 6

As explained in the docs, you can access data from the params object on the match prop.

In your case, it would be: match.params.product_id. For example:

function ProductDetail({ match }) {
  return (
    <div>
      <h3>PID: {match.params.product_id}</h3>
    </div>
  );
}