Vue.js 2 Cookbook

How it works…

When you use a URL that contains the hash symbol in the browser, the browser will send a request for the URL without the suffix after the hash, that is, when you have an event inside a page that goes to the same page but with a different hash suffix:

http://example.com#/page1 on  http://example.com#/page2

The browser will not reload the page; this is why vue-router can modify the content of the page when the user clicks on a link that only modifies the hash, without the page being reloaded.

When you change the mode from hash to history, vue-router will drop the hash notation and will leverage the history.pushState() function.

This function adds another virtual page and changes the URL to something else:

http://example.com/page1 ...