CODEWITHSUNDEEP
reactjsreact-router
ihavenokia
ihavenokia

Reputation: 157

React Router don't pass value to match.props

So, I started learning React with Redux and react-router. Big mess for a .net

I want to use the match object to find the props in a given url, so I can do this:

function NumberHeader ({match}){
   var number = match.props.nr;
   ..... Logic down here ...
}

I defined a route like this:

<Route path={`/number/:nr`} component={() => <NumberHeader match={this.props.match} />} />

The NumberHeader component is rendering at right url, but I can't get any props.

All this logic is happening not in the App root, it's happening in this rendered componen:

<Route path={routes.NUMERO} component={() => <DrawsPage />} />

What are the key factors that I need to folow, so this will work? I'm using the latest react-router v4. Thanks.

Upvotes: 0

Views: 498

Answers (1)

Roy Wang
Roy Wang

Reputation: 11260

Pass the props from the component declaration:

component={props => <NumberHeader {...props} />}

Alternatively, just do 

component={NumberHeader}

Upvotes: 2

Related Questions