useRoute,userRouter的用法

hykeda3年前 (2023-03-27)Vue2109

 import { useRoute, useRouter } from 'vue-router';

这里的useRoute是获取传递的变量：

const route = useRoute()

console.log(route.query) //get

console.log(route.params) //post

这里的useRouter是控制路由，构建跳转地址等：

 import { useRouter } from 'vue-router'
    export default {
        setup() {
            const userRouter = useRouter()
            userRouter.push("/home")
        }
    }

params 方式传递参数:

const userRouter = useRouter()
    userRouter.push({
        name: 'Home',
        params: {
             name: 'dx',
             age: 18
         }
    })

用query方式传递：

import { useRouter } from 'vue-router'
export default {
    setup() {
        const userRouter = useRouter()
        userRouter.push({
            path: '/',
            query: {
                name: 'dx',
                age: 18
            }
        })
    }
}