Check out my answer on StackOverflow https://stackoverflow.com/questions/31079081/programmatically-navigate-using-react-router/42121109#42121109 I would note that button navigation can be bad for accessibility (if you’re just treating it as a link), so I tend to limit programmatic navigation to form submission.
I didn’t actually write any CSS for this (except for the colors to easily differentiate the two loactions). The idea with these demos was for it to be obvious that the first one is incorrect (the exiting
<Switch> is being rendered using the new location) while the second one is correct (the exiting
<Switch> is being rendered using the previous…
I put this together pretty quickly from my comments explaining this to a user on Reactiflux, so I was avoiding writing all of the boilerplate necessary to get this actually running. It isn’t a lot of work, just stuff that I wanted to avoid in the code samples. Still, demos would be nice, so I’ll throw together a CodeSandbox demo in the next day or two and update the article.
I think that that can work. It wouldn’t have to be all connected components, just the ones that are location-aware or have location-aware children. I’m in the “you probably don’t need
react-router-redux” boat, so this isn’t something that I haven’t thought a lot about.