路由的几种常用模式
hash
- 区别: ① url 地址上有 # ; ②刷新页面不发生请求,页面不会有任何问题,不需要后端配合
- 实现的原理:原生的 hashChange 事件,只要是通过事件监听 hash 值的变化 window.onHashChange=function(){}.
- 优点: 兼容性较好
history
- 区别: ① url 地址上没有 # ; ②刷新页面会发生请求,会导致页面出现 404 ,需要后端配合解决
- 实现的原理:利用的 history api 中的 popState()、pushState() 来实现
- 优点:地址干净,美观
abstract模式
适用于所有JavaScript环境,例如服务器端使用Node.js.如果没有浏览器API,路由器将自动被强制进入此模式. 然后在 const router = new VueRouter({routes,mode:'hash|history|abstract'}) 这里进行切换
