1. 使用标签实现新窗口打开:
- 在页面导航中
<router-link>
被渲染为<a>
标签, 在vue2版本的<router-link>
支持 target="_blank" , 代码如下:<router-link target="_blank" :to="{path:'/home',query:{id:'1'}}">新窗口打开</router-link>
2. 编程式导航:
- 有些时候需要在单击事件或者在函数中实现页面跳转,那么可以借助
router
的示例方法,通过编写代码实现。我们常用的是$router.push
和$router.go
但是vue2.0以后,这种方式就不支持新窗口打开的属性了,这个时候就需要使用this.$router.resolve
, 传参时可以使用query,也可以使用params , 代码如下:newWindow(){ let routeUrl = this.$router.resolve({ path: "/newWindow", query: {id:96} }); window.open(routeUrl .href, '_blank'); }