Vue Router doesn't preserve URLs entered into the address bar

So I've got a Vue Router running in history mode. It works perfectly when clicking <router-links>, but I can't get address bar navigations to 'stick'. The address always reverts back to the previous URL, despite loading the correct page content.

You can replicate this yourself by running vue create projectName and choosing Manually select features -> Router -> Vue 3.x -> Use history mode (Y). This creates the example project below.

If you navigate to http://localhost:8080/about, the About view loads. Correct.

Now if you type http://localhost:8080/, the Home view loads, but the URL reverts to /about!

And if you type http://localhost:8080/about again, the exact opposite happens.

Am I doing something wrong, or is this a bug in Vue Router 4?

https://stackoverflow.com/questions/66729980/vue-router-doesnt-preserve-urls-entered-into-the-address-bar March 21, 2021 at 03:50PM