vue-router的两种模式

1、Hash（默认模式）

hash模式的工作原理是onhashchange事件,通过window.location.hash访问

window.onhashchange=function() {
	let hash = location.hash.slice(1);
	document.body.style.color = hash;
}

由于hash发生变化的URL都会被浏览器记录，虽然浏览器没有请求服务器，但页面状态和URL关联起来了。这就是前端路由（更新视图但不会重新请求页面），成为了单页面应用标配。

#符号本身以及他后面的字符称之为hash
http://www.aaa.cn/#/index, hash值为#/index

hash虽然出现在URL中，但不会被包括在http请求中，对服务器端完全无用。因此，改变hash不会重新加载页面。

2、history模式（对应HTML5 history）

history接口是浏览器历史记录栈提供的接口。HTML5开始，history interface提供了两个新的方法，pushState(),replaceState()可以对浏览器历史记录栈进行修改。虽然修改了URL，但浏览器并不会立即向后台发送请求。

特别注意： history模式需要后台配置支持，若后台配置不正确，访问就会出现404。

history模式不再有#， http://www.aaa.cn/index

前端URL必须和实际向后端发起请求的URL一致

vue-router的作用就是通过改变URL，在不重新请求页面的情况下，更新页面视图