vue3.0 route和router的区别

vue3中 router是用来操作路由的，route是用来获取路由信息的。

vue3中使用route与router需要通过npm下载并引入

import { useRouter, useRoute } from "vue-router";
const route = useRoute(); // 路由
const router = useRouter(); // 路由实例
console.log(router);

以下为route的输出结果，它包含当前路由所存储的信息

 常用属性有：

API 参考 | Vue Router

route.path  当前路由的路径

route.params  包含路由中的动态片段和全匹配片段的键值对，不会拼接到路由的url后面

route.query  包含路由中查询参数的键值对，会拼接到路由url后面

以下为router的输出结果，它包含所有的路由信息

 常用属性与方法可参考官方文档

API 参考 | Vue Router

options 可以获取到当前所有的路由信息

push 可以跳转到另一个页面，可以使用query或者params进行传参

// 此处router 为router实例
router.push({ name: 'Login', params: { type: 'params参数'} });

// route接收参数
console.log(route.params);// 输出结果为 { type: 'params参数'}