vue3 路由跳转新页面并传递参数与获取参数

打开新标签页面传递参数（useRouter ）

import { useRouter } from 'vue-router'
const uRouter = useRouter()
let page = uRouter.resolve({path:'/mapRollerShutter',query:{type:'Split',key:1}})window.open(page.href,'_blank')

页面接收（useRoute ）

import { useRoute } from 'vue-router'
const uRoute = useRoute()const key = ref()
const source = ref()onMounted(() => {
key.value = parseInt(uRouter.query.key)
source.value = uRoute.query.type
})

补充：不创建新标签页传参

import { useRouter } from "vue-router"
const uRouter = useRouter()
uRouter .push({path:'/mapRollerShutter',query:{type:'Split',key:1}})

parmas的形式传参需在路由处定义

//路由（跟？非必传，没有则必传）
path: "/mapRollerShutter/:type/:key?",//跳转
import { useRouter } from "vue-router"
const uRouter = useRouter()
uRouter .push({path:'/mapRollerShutter',params:{type:'Split',key:1}})//接收
import { useRoute } from 'vue-router'
const uRoute = useRoute()
console.log( uRoute.params)