路由的理解

vue是单页面，路由是用来根据用户请求，切换不同内容的控制器
路由有两种模式：hash和history，而默认的是hash模式，在router/index.js中配置
hash —— URL 中的 # 符号，hash在URL中，不在 HTTP 请求中，因此改变hash 不会重新加载
history 刷新页面，会向后台发送请求，路径没定义，则返回404，需要后台配置重定向
路由的使用：需要安装vue-router 路由配置包括path name component children
分为静态路由和动态路由
    静态路由：是路由path中没有参数
    动态路由：路由path中 /组件名/：参数名
在逻辑代码中通过this.$router.push(url,参数)跳转,传参可以用query 和 params，/路由/:参数
$route和$router区别：
  $route表示当前的路由信息，包含了当前URL的信息。包含当前的路径，参数，query对象等

  $router对象是全局路由的实例,包含方法：
    router-link （声明式路由）
    this.$router.push() 向 history 栈添加一个新的记录
    this.$router.replace() 不会向 history 栈添加一个新的记录
    this.$router.go(n) 向前或者向后跳转n个页面，n可为正整数或负整数
路由懒加载按需加载，减少首页加载用时，可避免首页白屏
路由守卫
全局守卫：放在main.js的router的配置中，beforeEach((to即将进入, from当前离开,next下一步)afterEach((to, from)
局部守卫：在组件内定义的 beforeRouteEnter beforeRouteUpdate beforeRouteLeave
独享守卫只作用于被设置守卫的路由 beforeEach afterEach

追问：
hash模式和history模式原理及区别
hash路由模式原理
#，这个#就是hash符号，中文名哈希符或者描点。哈希符后面的值叫做哈希值。

路由的哈希模式其实就是利用了window可以监听onhashchange事件。
如果url中的哈希值发生变化，前端就可以做到监听并做一些响应，这样一来，即使前端没有发送http请求他也能够找到对应页面的代码进行按需加载。
build之后本地 index.html 打开正常
history路由模式原理
H5新推出的两个方法，pushState与replaceState

如果服务端没有新更新的url时，一刷新浏览器就会报错，因为刷新浏览器后，是真实地向服务发送一个http请求。因此若使用history路由，需要服务端的支持。

H5新推出的两个方法，pushState与replaceState ，简而言之，这两个方法的作用就是可以将url替换并且不刷新页面，
http并没有去请求服务器该路径下的资源，一单刷新就会显示404
怎么解决刷新报404的弊端呢，这就需要服务器将不存在的路径请求重定向到入口文件，
build之后本地 index.html 打开是无效的。

history.pushState() 和 history.replaceState() 方法，它们分别可以添加和修改历史记录条目。这些方法通常与window.onpopstate 配合使用。