CODEWITHSUNDEEP
javascriptreactjs
user5992977
user5992977

Reputation:

React extract param from url

I'm using react-router for routing . I've used NavLink and Route components like this:

 <NavLink className={classes.navLink}
          activeClassName={classes.activeNavLink}
          to={`/brokers/${n.id}`}\> 
....
<Route exact path="/brokers/:id" component={BrokerDetails} />

Now my question is - how do I use the id parameters passed in inside the BrokerDetails component ? I tried reading it via the props but it doesn't exist .

Upvotes: 0

Views: 185

Answers (2)

Praveen Rao Chavan.G
Praveen Rao Chavan.G

Reputation: 2860

If you try to access props.Id won't work because it isn't in that location.

When you try to access params from an URL, which is passed using 'React-router-dom', then the way to access the props is match.params.id

Upvotes: 0

AKX
AKX

Reputation: 169012

When using component=..., your component will be passed the route props.

In particular, you'll want to access the match object:

const BrokerDetails = ({match}) => <div>{JSON.stringify(match.params)}</div>;

should show you all the parameters; match.params.id would be the id parameter.

Upvotes: 1

Related Questions