vue3中 router
是用来操作路由的,route
是用来获取路由信息的。
vue3中使用route与router需要通过npm下载并引入
import { useRouter, useRoute } from "vue-router";
const route = useRoute(); // 路由
const router = useRouter(); // 路由实例
console.log(router);
以下为route的输出结果,它包含当前路由所存储的信息
常用属性有:
route.path 当前路由的路径
route.params 包含路由中的动态片段和全匹配片段的键值对,不会拼接到路由的url后面
route.query 包含路由中查询参数的键值对,会拼接到路由url后面
以下为router的输出结果,它包含所有的路由信息
常用属性与方法可参考官方文档
options 可以获取到当前所有的路由信息
push 可以跳转到另一个页面,可以使用query或者params进行传参
// 此处router 为router实例
router.push({ name: 'Login', params: { type: 'params参数'} });
// route接收参数
console.log(route.params);// 输出结果为 { type: 'params参数'}