Vue Router 弹出新页面传参

弹出新页面，需要设置 target=”_blank”

query 传参

<router-link> 跳转

 <router-link target="_blank" :to="{path:'/home',query:{id:'112'}}">home页</router-link>

编程式导航

const {href} = this.$router.resolve({
     name: "statistics-explain",
     query: {
         classID: id,
         studentStatus: 0
     }
 });
 window.open(href, '_blank');

可以使用query，也可以使用params

/data/:id 这个路由匹配 /data/1,/data/2 这里的 id 叫 params
/data?id=1 /data?id=2 这里的 id 叫 query 

params 传参

params 可以用下面方法传参

const { href } = this.$router.resolve({
      path: "/conversation/:" + id
   });
window.open(href, "_blank"); 

this.$route.params.id //新页面中取值方法

多个参数的时候

路由设置：

 {
    path: '/detail/:id/:name',
    name: "detail",
    component: Detail//这个details是传进来的组件名称
 }  

路由跳转：

 this.$router.push({name:'detail',params:{id:123,name:'hha'}})   

参考链接：

https://blog.csdn.net/xiaxiangyun/java/article/details/80667293

https://blog.csdn.net/thinkingw770s/article/details/94390788

https://router.vuejs.org/zh/api/#router-resolve