Unable to access dynamic params from child component

[cdes]

Hey,

I'm using react-router-dom 4 with react-router-modal and I have a dynamic segment/parameter in my route like this:

<ModalRoute
  parentPath="/"
  path="/users/:userId"
  component={UserProfile}
/>

and my child component is as simple as follows:

const UserProfile = props => {
  return <div>{props.match.params.userId}</div>
}

When I visit: http://localhost/users/3234

The modal is being displayed as: <div>undefined</div>

I expect to have the match with the parameter {userId: 3234} and path to be /users/3234. However, the params object is empty, and the path is "/"

Am I doing something wrong?

How do I access match.params from UserProfile?

[davidmfoley]

Check out the "Using match.params" example here: https://davidmfoley.github.io/react-router-modal-examples

If you share the complete set of code you are working on (create a private gist if you don't want to share with the public), I will take a look and see if I can replicate the behavior. It sounds like you are doing everything correctly, so if there is a common error case that is not obvious, it would be good to detect it and warn the user.

Thanks, Dave

[cdes]

Never mind.

It was a bad implementation from my side.

I did not notice that I was misusing withRouter while exporting UserProfile.