CODEWITHSUNDEEP
reactjs
Blankman
Blankman

Reputation: 267020

How to pass a prop to my child route?

I have a child route that I want to pass locationId prop to.

I tried just adding locationId={locationId} to my Route but that didn't work.

return (
  <div>
      <Route path={`${this.props.match.url}/users/:userId`} component={CardsShowView} />
  </div>
);

Is it possible to pass this prop somehow?

Upvotes: 1

Views: 48

Answers (2)

Erick
Erick

Reputation: 1146

You need to pass the locationId as a param with the Route.

<Link to={url/${locationId}}>

in your Route: <Route path="url/:locationId component={CardsShowView}

you can access the params in your child component by using this.props.params.locationId

Upvotes: 0

Omar
Omar

Reputation: 3411

<Route path={`${this.props.match.url}/users/:userId`} render={() => 
<CardsShowView locationId={locationId}/>} />

You can use the render prop.

If you actually want the location, you can do it like this.

<Route path={`${this.props.match.url}/users/:userId`} render={(props) => 
<CardsShowView locationId={props.location}/>} />

Upvotes: 2

Related Questions