小编给大家分享一下vue-router如何实现跳转时打开新页面，相信大部分人都还不怎么了解，因此分享这篇文章给大家参考一下，希望大家阅读完这篇文章后大有收获，下面让我们一起去了解一下吧！

成都创新互联公司是一家专业提供西塞山企业网站建设,专注与成都网站建设、网站建设、H5开发、小程序制作等业务。10年已为西塞山众多企业、政府机构等服务。创新互联专业网络公司优惠进行中。

1、标签实现新窗口打开

官方文档中说 v-link 指令被 组件指令替代，且 不支持 target="_blank" 属性，如果需要打开一个新窗口必须要用标签，但事实上vue2版本的 是支持 target="_blank" 属性的(tag="a")，如下：

新页面打开home页

2、编程式导航

有些时候需要在单击事件或者在函数中实现页面跳转，那么可以借助router的示例方法，通过编写代码实现。我们常用的是 $router.push 和 $router.go 但是vue2.0以后，这种方式就不支持新窗口打开的属性了，这个时候就需要使用this.$router.resolve,如下：

seeShare(){
   let routeUrl = this.$router.resolve({
     path: "/share",
     query: {id:96}
   });
   window.open(routeUrl.href, '_blank');
}

以上是“vue-router如何实现跳转时打开新页面”这篇文章的所有内容，感谢各位的阅读！相信大家都有了一定的了解，希望分享的内容对大家有所帮助，如果还想学习更多知识，欢迎关注创新互联行业资讯频道！