Vue 跳转到新的标签页 在新的窗口打开页面 可传参

实现跳转到新的标签页通常通过在a标签中添加target="_blank"属性

在Vue项目中跳转到新页面可利用以下两种方法实现。

1、自定义组件router-link
在router-link里添加 `target="_blank"`即可跳转到新页面，并实现传参数。

<router-link :to="{ name: '/new_page', params: { userId: '123' }}" target="_blank" >
       跳转到新的标签页
</router-link>

2、window.open()方法实现
this.$router.resolve +  window.open 实现。
window.open()方法用于打开一个新的浏览器窗口或查找一个已命名的窗口,即page.href.

 <template>
    <div @click="toPage(e)">跳转到新的标签页</div>
 </template>

<script>
    export default {
        methods:{
            toPage(e){
                let page = this.$router.resolve({
                    name:'url',
                    query: {id: id, e:0}
                })
                window.open(page.href, '_blank');
            }
        }
    }
</script>

如果有帮助请记得一键三联哦