vue3.0 router路由跳转传参（router.push）

vue3.0取消了2.0部分api，所以路由跳转传值方式有所不同。

这里主要讲编程式导航，也就是router.push(location, onComplete?, onAbort?)

vue3.0新增API：useRouter和useRoute

一.路由跳转

1.首先在需要跳转的页面引入API—useRouter

import { useRouter } from 'vue-router'

2.在跳转页面定义router变量

 const router = useRouter()

3.用router.push跳转页面

// 字符串
router.push('home')

// 对象
router.push({ path: 'home' })

// 命名的路由
router.push({ name: 'user', params: { userId: '123' }})

// 带查询参数，变成 /register?userId=123
router.push({ path: 'register', query: { userId: '123' }})

4.如果有参数的话，在接收页面引入API–useRoute

import { useRoute } from 'vue-router'

5.在接收页面定义变量route，获取传过来的变量

//query
let userId=route.query.userId;

//params
let userId=route.pa