Routes are not navigating when React v15.5 setup with react-redux v5 is

Question

I am new with React and I have setup my React project with Facebook\'s create-react-app. Here are the core files:

Index.js

import Re         


        

Answer 1

The solution is here

import { withRouter } from 'react-router-dom'

// before
export default connect(mapStateToProps)(Something)

// after
import { withRouter } from 'react-router-dom'
export default withRouter(connect(mapStateToProps)(Something))

Generally, React Router and Redux work just fine together. Occasionally though, an app can have a component that doesn’t update when the location changes (child routes or active nav links don’t update).

This happens if:

• The component is connected to redux via connect()(Comp).
• The component is not a “route component”, meaning it is not rendered like so: <Route component={SomeConnectedThing}/>

The problem is that Redux implements shouldComponentUpdate and there’s no indication that anything has changed if it isn’t receiving props from the router. This is straightforward to fix. Find where you connect your component and wrap it in withRouter.