react-router: How do I update the url without causing a navigation/reload?

Wasn’t able to find a solution using React Router, but was able to accomplish this using the browser’s history interface by calling:

window.history.replaceState(null, "New Page Title", "/pathname/goes/here")

You can learn more about .replaceState here.

React Router’s history.replace won’t always work

React Router’s history.replace method may or may not trigger a re-render depending on your app’s route setup (e.g., you have a catch-all /* route). It does not prevent a render by definition.

Leave a Comment