vue-router实现原理

简单的来说，路由跳转其实就是用来后台服务器进行的一种交互方式，通过不同的路径，来请求不同的资源，请求不同的页面是路由的一种功能。
vue-router 提供了三种运行模式：
● hash: 使用 URL hash 值来作路由。默认模式。
● history: 依赖 HTML5 History API 和服务器配置。查看 HTML5 History 模式。
● abstract: 支持所有 JavaScript 运行环境，如 Node.js 服务器端

1、hash模式
hash即浏览器url中#后面的内容，包含#。
随着ajax的流行，异步数据的请求交互运行在不同的情况下进行。而用户的更高级别的版本SPA–单页面。单页面在应用不仅仅是在无刷新的，在页面跳转也是不刷新的。为了实现单页应用，所以就有了单页应用
hash路由跳转会有“#“，hash值每次变化的时候，都会触发hashchange事件。这个事件，通过这个事件我们就可以知道 hash 值发生了哪些变化。然后我们便可以监听hashchange来实现更新页面部分内容的操作

2、history模式
因为HTMl5的正式发布，所以多了两个API。pushState和replaceState通过API去请求。过这些就能用另一种方式来实现前端路由了，但原理都是跟 hash 实现相同的。用了 HTML5 的实现，单页路由的 url 就不会多出一个#，变得更加美观。但因为没有 # 号，所以当用户刷新页面之类的操作时，浏览器就会向服务器重新请求一次，这样就影响了正常的开发环境，为了避免这样的情况。我们需要去把所有的页面重定向到根页面。

3、abstract
他是一个虚拟管理应用后端。
根据平台差异可以看出，在 Weex 环境中只支持使用 abstract 模式。 不过，vue-router 自身会对环境做校验，如果发现没有浏览器的 API，vue-router 会自动强制进入 abstract 模式，所以 在使用 vue-router 时只要不写 mode 配置即可，默认会在浏览器环境中使用 hash 模式，在移动端原生环境中使用 abstract 模式。 （当然，你也可以明确指定在所有情况下都使用 abstract 模式）。