Cannot read property ‘params’ of undefined (React Router 4)

In my case, I found out that it is no longer match in the router props, it is now computedMatch.

I.E: this.props.computedMatch.params.id

Hope this helps someone!


Because with render you are not passing the default props passed by the router into component, like match, history etc.

When you write this:

<PageStart key={this.props.location.key} />

It means no props value in PageStart component.

Write it like this:

render = {props => <PageStart {...props} key={this.props.location.key} /> } />

Now {...props} will pass all the value into PageStart component.


Because you don't pass any match property to PageStart. You give it a key but no match. Try this:

<Route 
    exact 
    path="/page/:id" 
    location={this.props.location} 
    key={this.props.location.key} 
    render={({ 
        location, 
        match 
    }) => (
        <PageStart key={this.props.location.key} match={match} />
    )} 
/>