1路由讲解 2vue路由跳转与winow.localtion.herf跳转区别 3vue 路由怎样在一个新窗口页面打开、 4vue路由传参(防止页面刷新参数丢失) 5通过window.location.href跳转项目任何一个页面 6 前端路由的实现原理（更新视图但不重新请求页面）
1在讲解路由之前，先讲一下路由的实现原理：更新视图但不重新请求页面，是前端路由原理的核心之一，目前在浏览器环境中实现这一功能有以下这两种方式（详细介绍看第6点）： 利用URL中的hash("#"); 利用History interface在HTML5中新增的方法;。 路由，其实就是指向的意思。但点击页面上的Home按钮时，页面就要显示home指向的路由页面。当点击about按钮时，页面就要显示about指向的页面。
路由中有三个基本的概念 route, routes, router。 route是一个跳转的路由对象，每一个路由都会有一个route对象，是一个局部的对象，可以获取对应的name,path,params,query等.。我们经常来用他来进行传参。 routes 是一组路由，把上面的每一条路由组合起来，形成一个数组。[{home 按钮 =>home内容 }， { about按钮 => about 内容}]
router 是路由管理器。当用户点击home 按钮的时候，怎么办？这时router 就起作用了，它到routes 中去查找，去找到对应的 home 内容，所以页面中就显示了 home 内容。 注意：vue的 this.$router.push() push后面的，可以是字符串，也可以是对象，，对象有name和path这些，，如果是字符串，字符串是改变path的值
2单页内路由跳转（this.$router.push），产生的history变化，使得对应组件重新执行，但不刷新页面；但，使用href、window.location进行跳转，产生的history变化，将使得页面重新刷新。 此处顺便讲解以下window…location.replace和 window.location.href区别： 例子： 有3个页面 a,b,c 如果当前页面是c页面，并且c页面是这样跳转过来的：a->b->c 1：b->c 是通过window.location.replace("…xx/c") 此时b页面的url会被c页面代替，并且点击后退按钮时会回退到a页面（最开始的页面） 2：b->c是通过window.location.href("…xx/c") 此时b页面的路径会被c页面代替，但是点击回按钮后页面回退的是b页面 两者的区别: 两者后退时所回退的页面不一样
3vue 路由怎样在一个新窗口页面打开 vue-router在新窗口打开页面 let {href}=this.$router.resolve({name:‘application_detail’}) window.open(href,’_blank’);
4vue路由传参 vue路由刷新页面，导致传参消失处理。通过param进行传递参数，因为传过来的是url，这种传参，如果 刷新页面，会导致参数消失 解决方法：
1 使用query进行传参 this.$router.push({ name: 'NewsDetail', query: { newsUrl: url } }) 获取值 this.$route.query.queryName; 2 使用params传值 在配置路由处做修改。 routes: [ { path: '/list/:id', name: 'list' } ]； this.$router.push({name:'list', params:{id: id}}); 获取id：this.$route.params.id 另外，如果id值是可传可不传的，路由可以进行这样的配置(在参数后面加上问号?)： routes: [ { path: '/list/:id?', name: 'list' } ]；5通过window.location.href跳转项目任何一个页面 这里的/view表示项目根目录下 window.location.href = “/myCenter/train_order_list” 这里的/mycenter表示根目录下的mycenter文件夹 下的train_order_list文件
6 前端路由的实现原理 如何实现前端路由（更新页面url但不刷新页面）。 要实现前端路由，需要解决两个核心： 1如何改变URL却不引起页面刷新？ 2如何检测URL变化了？ 改变URL的方式只有这几种方式： 1 通过浏览器的前进和后退改变 url， 2通过 标签改变URL， 3通过window.location改变URL。 下面分别使用 hash 和 history 两种实现方式回答上面的两个核心问题。 hash实现 1hash是URL中hash（#）及后面的那部分，常用作秒点在页面进行导航，改变url中的hash部分不会引起页面刷新 2通过hashchange 事件监听URL的变化，当URL改变的时候，会触发hashchange事件
history实现 history 提供了pushState和replaceState两个方法。这两个方法改变URL的path部分不会引起页面刷新 history 提供类似hashchange事件的popstate事件，但popstate事件有些不同，通过浏览器前进后退改变utl时会触发popState事件，通过pushState/replaceState或标签改变URL不会触发popstate事件，好在我们可以拦截pushState/placeState的调用和的点击事件来检索URL变化，通过监听URL变化可以实现，只是没有hashchange那么方便。
参考文档： https://www.cnblogs.com/lguow/p/10921564.html
