vue
vue-router
和router的区别
route获取路由信息:包含path、param、query、matched、hash、fullPath等信息
router操作路由:mode,hooks,是全局路由的实例,是router构造方法的实例。router是vuerouter的一个对象,通过Vue.use和Vue构造函数得到一个router的实例对象,包含了所有的路由还有很多关键对象的属性。
路由导航守卫:
beforeEach、beforeResolve、afterEach
hash和history模式的区别
表面上:hash带#,history不带
浏览器支持上:hash支持低版本浏览器,history没那么友好
hash值改变不会重新加载页面,对传给后端的url没有影响,因此不会重新加载页面。每次改变都会触发hashchange事件,可以通过hashchange事件进行监听,单页应用。
history使用了h5的新特性:pushState和replaceState方法,再原有的back、forward、go的基础上,添加对历史记录修改的功能。他虽然改变了url,但浏览器不会立即向后端发起请求。
history刷新页面会发起亲求,后端如果没有相应处理会报404错误,需要和后端配合。
单页和多页应用的区别
单页应用一个外壳页面和多个页面片段组成。多页应用由多个完整页面构成。
单页应用,资源公用只需在外壳部分加载;多页应用不共用,每个页面都需要加载。
刷新方式:单页,页面局部刷新或更改;多页,整页刷新。
url表现:单页:url带#;多页,不带#。
用户体验:单页:页面片段间切换快,用户体验好;多页,切换页面慢;
转场动画:单页:容易实现转场动画;多页,页面切换加载缓慢,流畅度不够,用户体验差;
数据传递:数据传递容易,多页依赖url,或者cookie、locaStorage等。
搜索引擎:单页应用有利于搜索引擎;多页应用实现方法简单。
试用范围:高要求的体验度,追求界面流畅的应用;多页,适用于支持高搜索引擎应用。
开发成本:单页:开发成本高,需要借助专业框架;多页,重复性代码多。
维护成本:相对容易;多页,相对复杂。