$route和$router的区别详解

最新推荐文章于 2024-10-11 16:49:20 发布

xunfengZ

最新推荐文章于 2024-10-11 16:49:20 发布

阅读量1.1w

点赞数 32

分类专栏： vue 文章标签： vue vue.js

本文链接：https://blog.csdn.net/xunfengZ/article/details/109670979

版权

$route用于获取当前路由信息，如path、params、query和name，而$router是VueRouter实例，用于路由操作，包含路由跳转方法和钩子函数。$router的history对象管理路由历史，常用方法包括进行路由切换。

摘要由CSDN通过智能技术生成

总的来说，
$ router是用来操作路由的，$ route是用来获取路由信息的。

1.$router是VueRouter的一个实例，他包含了所有的路由，包括路由的跳转方法，钩子函数等，也包含一些子对象（例如history）
常用的跳转连接的方法：

//常规方法
this.$router.push("/login");
//使用对象的形式 不带参数
this.$router.push({ path:"/login" });
//使用对象的形式，参数为地址栏上的参数
this.$router.push({ path:"/login",query:{username:"jack"} }); 
使用对象的形式 ，参数为params 不会显示在地址栏
this.$router.push({ name:'user' , params: {id:123} });

本质是向history栈中添加一个路由，在我们看来是切换路由，但本质是在添加一个history记录
在这里插入图片描述
2.$ route是一个跳转的路由对象（路由信息对象），每一个路由都会有一个$route对象，是一个局部的对象。