vue-router(this.$router)如何在新窗口打开路由跳转页面
作者：『减减』
这篇文章主要介绍了vue-router(this.$router)如何在新窗口打开路由跳转页面问题,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教
vue-router(this.$router)在新窗口打开路由跳转页面
使用标签实现新窗口打开
在页面导航中被渲染为标签, 在vue2版本的支持 target=“_blank”
代码如下：
<router-link target="_blank" :to="{path:'/note'}">新窗口打开</router-link>编程式导航
有些时候需要在单页面中实现页面跳转，那么可以借助router的示例方法，通过编写代码实现。
我们常用的是$router.push 和$ router.go 但是vue2.0以后，这种方式就不支持新窗口打开的属性了，这个时候就需要使用this.$router.resolve, 传参时可以使用query，也可以使用params
代码如下：
const routeUrl = this.$router.resolve({
path: '/路径',
query: { id }
})
window.open(routeUrl.href, '_blank')
vue报错之this.$router is undefine
最近写项目遇到这个报错，特此记录一下
axios.get('/person/ticket')
.then(response => {
this.$router.push('/ground')
})原因很简单，因为我使用的是箭头函数，改变了this指向，所以vue在这里找不到$router，从而报错
解决很简单
保留this即可
const that = this;
axios.get('/person/ticket')
.then(response => {
that.$router.push('/ground')
})总结
以上为个人经验，希望能给大家一个参考，也希望大家多多支持脚本之家。