React this.props.params undefined

replace this :

<Route path={"product/:id"} component={()=>(<div><Menu/><DetailsProduct>asd</DetailsProduct></div>)}></Route>

with :

<Route path={"product/:id"} component={DetailsProduct}></Route>

I was also getting the same problem when I used this.props.params.id.

But when i tried to put console.log(this.props) in the component where I'm passing the id, it shows my id in match object so use:

this.props.match.params.id

to get the id (notice the added match).

For me I was using the render method and finding that this.props.match was undefined in rendered components. This was the solution for me, you have to pass in props.

this.props.match will be undefined for:

<Route path='/users/:id' render={() => <UserDetail/>}/>

Do this instead:

<Route path='/users/:id' render={(props) => <UserDetail {...props}/>}/>

https://reacttraining.com/react-router/web/api/Route/render-func