this.$route和this.$router的区别

1. this.$router：　　    (个人观点：可以用来传递参数)

表示全局路由器对象，项目中通过router路由参数注入路由之后，在任何一个页面都可以通过此方法获取到路由器对象，并调用其push(), go()等方法；

this.$router.push({

path: ‘/monitor‘,

query:{

id:id,

}

}）

2. this.$route:　　　　(个人观点：可以用来获取参数)

表示当前正在用于跳转的路由器对象，可以调用其name、path、query、params等方法；

this.$route.query.id

注：使用的时候注意拼写，两个很像，就差一个字母，经常会因为写错而导致调用的方法无效，而且浏览器的控制台中还不会报错。。。
-----------------------------------------------------------------------------------------------------------------

做项目的时候发现传参数是通过 this.$route.query或者 this.$route.params接收router-link传的参数。

在路由跳转的时候除了用router-link标签以外需要在script标签在事件里面跳转，所以有个方法就是在script标签里面写this.$router.push(‘要跳转的路径名‘)，还有this.$router.go(-1)返回上一页面

在写的时候发现这两个为什么不同，在控制台打出this的时候，发现$route和$router同时存在

$route为当前router跳转对象里面可以获取name、path、query、params等

$router为VueRouter实例，想要导航到不同URL，则使用$router.push方法

返回上一个history也是使用$router.go方法

原文地址：https://www.cnblogs.com/showcase/p/10565212.html

时间： 2024-07-30 15:53:57

this.$route和this.$router的区别的相关文章

Vue---this.$route和this.$router这两个对象

// 注意: 在 this 这个组件身上,有 this.$route 和 this.$router // this.$route 是专门用来获取路由中参数的: // this.$router 是专门来实现编程式导航的: // 注意:this.$route和this.$router这两个对象 // this.$route是路由参数对象,所有路由中的参数,params,query都属于他 // this.$router 是一个路由(导航对象),用它方便的使用js 代码,实现路由的前进,后退,跳转到新

vue中$route 和$router的区别

在vue中会出现一种情况 const url=this.$route.query.returnURL; this.$router.push(url); $router和$route的区别傻傻的分不清 1.先说$router这个就是router的实例, 在创建vueRouter实例 const router=new VueRouter({ routes }) $router就是这个实例 而$route是$router中的一个一个对象 只想要导航到name,query,params等 原文地址:ht

$route 和 $router 的区别

最近在学习vue的单页面应用开发,需要vue全家桶,其中用到了VueRouter,在路由的设置和跳转中遇到了两个对象$router 和 $route ,有些傻傻分不清,后来自己结合网上的博客和自己本地的Vue devtools结构了解了他们的区别 1.router是VueRouter的一个对象,通过Vue.use(VueRouter)和VueRouter构造函数得到一个router的实例对象,这个对象中是一个全局的对象,他包含了所有的路由包含了许多关键的对象和属性. 举例:history对象 $

vue中的$route和$router的区别

1. $route是一个对象 可以获取当前页面的路由的路径query.params.meta等参数: 2.$router是VueRouter的一个实例对象 在options中可以获取路由的routes配置参数. 原文地址:https://www.cnblogs.com/fangyinghua/p/9298146.html

Hub, bridge, switch, router的区别

这些概念性的东西,其实,有的区别不是很大,有的区别很大. Hub 就是一个重复转发器,就是从一个port接受到数据后,就会原样的向其他的所有端口发送刚才收到的数据.个人理解为是工作在物理层的东西.但是,后来发展中,出现了些所谓的智能hub,就是可以做简单的配置,实现端口管理.这个所谓的智能的hub,和后续的bridge/switch的差别貌似小了一步.下面参考外文网站上的介绍: A hub is a repeater, which is a OSI model device, the simpl

MVC route 和 Angular router 单页面的一些方式

直接看代码和注释吧 ASP.NET MVC router public class RouteConfig { public static void RegisterRoutes(RouteCollection routes) { routes.IgnoreRoute("{resource}.axd/{*pathInfo}"); routes.IgnoreRoute("favicon.ico"); routes.MapMvcAttributeRoutes(); //

VUE学习--路由跳转方式||路由跳转携带参数方式||目标路由接受参数方式

跳转方式1:.使用便签跳转, <router-link to="{path:'路由地址',params:{传的数据},query:{传的参数}" >:跳转方式2:导航跳转,{在路由内 (路由对象) router.push({ path:'路径',//具有导航功能 name:‘路由名称’,,//同样具有导航功能 params:{传的数据}, query:{传的参数}"});在组件内 (路由对象)this.$router.push(参数同上); 传参方式1:query

$router&amp;$route的区别

$route为当前router跳转对象 里面可以获取name.path.query.params等 $router为VueRouter实例,想要导航到不同URL,则使用$router.push方法 返回上一个history也是使用$router.go方法 总结:感觉$route是$router的子集(纯属个人理解) 原文地址:https://www.cnblogs.com/fewhj/p/9264483.html

vue2.0 $router和$route的区别

在vue2.0里页面参数是 this.$route.query或者 this.$route.params 接收router-link传的参数. 在路由跳转的时候除了用router-link标签以外需要在script标签在事件里面跳转,所以有个方法就是在script标签里面写this.$router.push('要跳转的路径名'), 在写的时候发现这两个为什么不同,在控制台打出this的时候,发现$route和$router同时存在 $route为当前router跳转对象里面可以获取name.pa