CODEWITHSUNDEEP
reactjs
Oblomov
Oblomov

Reputation: 9665

Geting Route params in React Router

In the following snippet

 <Route path='/:category' render={() => (
    <div>
       {console.log(...)}
    </div>
 )}/>

How can I output the value of the category paramater? i.e., with what code do I have to replace the ... in {console.log(...)} ? 

{console.log(props.match.params.category)}

is not working, because match is undefined.

Upvotes: 1

Views: 1099

Answers (4)

Elumalai Kaliyaperumal
Elumalai Kaliyaperumal

Reputation: 1520

Try something like

<Route path="/:category" render={({match}) => (<div>
       {match.params.category}
</div>)} />

Upvotes: 0

julian libor
julian libor

Reputation: 1711

check the props for:

match.params.category

Here is an example

const Demo = ({ match }) => (
  <div>
    <p>{match.path}</p>
    <p>{match.url}</p>
    <p>{match.params.category}</p>
  </div>
);

And also: Full example on codesandbox.io

Upvotes: 0

Przemek eS
Przemek eS

Reputation: 1304

Try this

 <Route exact path={"/:category"} render={(props) => (<div>
       {console.log(props.match.params.category)}
    </div>)}/>

Upvotes: 0

Krisztian Balla
Krisztian Balla

Reputation: 136

<Route path='/:category' render={({match: { params: { category } } }) => (
  <div>
   {console.log(category)}
  </div>
)}/>

Upvotes: 4

Related Questions