vue 如何在新窗口打开页面
1. <router-link>标签实现新窗口打开:官方文档中说v-link指令已经被一个新的<router-link> 组件指令替代,这一部分的工作已经被 Vue 2 中的组件完成。注意:<router-link>不支持target="_blank",如果你想打开一个新标签页,你必须用<a>标签。但事实上vue2版本的 <router-lin
·
1. <router-link>标签实现新窗口打开:
官方文档中说 v-link
指令已经被一个新的 <router-link> 组件指令替代,这一部分的工作已经被 Vue 2 中的组件完成。
注意:<router-link>
不支持 target="_blank"
,如果你想打开一个新标签页,你必须用 <a>
标签。
但事实上vue2版本的 <router-link> 是支持 target="_blank" 属性的(tag="a"),如下:
1 <router-link target="_blank" :to="{path:'/home',params:{id:'8'}}">新页面打开home页</router-link>
2、编程式导航:
有些时候需要在单击事件或者在函数中实现页面跳转,那么可以借助router的示例方法,通过编写代码实现。
我们常用的是 $router.push 和 $router.go 但是vue2.0以后,这种方式就不支持新窗口打开的属性了,这个时候就需要使用this.$router.resolve,如下
1 goToLoanOrderDetail(loanOrderId, userId) {
2 let routeData = this.$router.resolve({
3 name: 'orderDetail',
4 params: { loanOrderId, userId }
5 });
6 window.open(routeData.href, '_blank');
11 },
点击事件调用此方法就好
更多推荐
已为社区贡献1条内容
所有评论(0)