connected-react-router: Push action not working properly

Package version: connected-react-router@6.3.1 I have: <Route path="/" component={HomePage} exact />

In saga I do push("/") and the location is changed but HomePage is not rendered. When I change in react-devtools exact on the Route to false, HomePage is rendered.

Downgrading to connected-react-router@6.0.0 helped me to solve the problem.

About this issue

  • Original URL
  • State: open
  • Created 5 years ago
  • Reactions: 33
  • Comments: 37

Most upvoted comments

In case someone faces this issue…

I had an issue with redirects: I was not redirected to the destination page when using push:

yield put(push('/login'));

I was using both react-router-dom wrap (<Router>) and connected-react-router wrap ( <ConnectedRouter history={history}>).

Removing the <Router> wrap helped, and everything is working as expected.

Wow, was pulling my hair out over this one for a few hours. I’m using:

"connected-react-router": "^6.3.1",
"react-router-dom": "^5.0.0",

And all is working now, from what I can tell.

@acaravia The problem is that you have specified react-router version in package.json to be 4.3.1. Install 4.4.0-beta.7 too or not install any. It will be installed properly by react-router-dom.

Just ran into this today. connected-react-router@6.3.1 with react-router-dom@4.3.1 is not working properly. Downgraded to v6.0.0 fixed the issue.

Just faced this issue, I was just not using the same history object everywhere. I made my configureStore create and export the history, then used it in the ConnectedRouter and it works !

Just to add one more successful case - previously push() won’t work in my saga either, but now it navigates successfully. It turns out the way I dispatch in saga is wrong.

Instead of:

...
put(push("/home/"));
yield put(SuccessAuthAction());
...

You should write

...
yield put(SuccessAuthAction());
yield put(push("/home/"));
...

yield [put(SuccessAuthAction()), put(push("/home/"))]; won’t work as well.

About version - I use React + Typescript with "react-router-dom": "^5.0.0", "connected-react-router": "^6.3.2", - all latest at this point.

I benefit a lot from what people mentioned above, but particularly I want to add - you do have to use <ConnectedRouter> over <Router>, at least with the same tech stack & version, otherwise navigation with push() won’t work.

I agree it’s broken with the pair of:

"connected-react-router": "6.3.1",
"react-router-dom": "4.3.1",

However, its works in:

"connected-react-router": "6.0.0",
"react-router-dom": "4.3.1",

It also works in:

"connected-react-router": "6.3.1",
"react-router-dom": "4.4.0-beta.7",

I’ve chosen the last one. Thanks for the issue and the info!

Using connected-react-router@6.3.1. together with react-router-dom@4.4.0-beta.7 solved all the problems for me. It solved #242 too, I guess because new react-router uses the new context API. It even the solves blocking updates issues react-router-dom@4.3.1 have.

Even tho it is just a beta it looks stable and I highly recommend to try it. Looks like this issue can be closed.