Skip to content

Instantly share code, notes, and snippets.

@ilagnev

ilagnev/README.md

Last active June 5, 2018 08:31
Show Gist options
  • Save ilagnev/d653768fd6b45a0f3b85a2a87d2aab09 to your computer and use it in GitHub Desktop.
Save ilagnev/d653768fd6b45a0f3b85a2a87d2aab09 to your computer and use it in GitHub Desktop.
Download ZIP
React Router v4 Warning: You cannot PUSH the same path using hash history
Raw
README.md

I use ReactRouter v4 with HashRouter to build spa which embeded to the existing page, so i lay on hash routring to switch my views. I don't use global state management like Redux or flux. I suppose to use react as a slim front end. All i need is to send request to the backend everytime when some action occured, and then show appropriate component with data. And offcourse i tried to use RR

history.push(path, state)

and got this error 'Warning: You cannot PUSH the same path using hash history'.

Then i was seeking around the internet for solution and found this comment, @matthewrobb suggested to use BrowserRouter with hash sign at the end and push store. This solution is working, but it adds leading slash at the location like this 'site.com/subpage#/intro-view'.

Luckily i found better solution for my case 😊

In documentation for history navigation wrote next 'Note: Location state is only supported in createBrowserHistory and createMemoryHistory.'. But if use location object to PUSH and REPLACE this warning do not appear and you can access state in nested components 👍 So instead of invoking

history.push(path, state)

try to use

history.push({pathname: path, state: state})
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment