$router是用来操作路由的,$route是用来获取路由信息的
$route对象表示当前的路由信息,包含了当前URL解析得到的信息
$route:
1、$route.path
字符串,对应当前路由的路径,总是解析为绝对路径
2、$route.params
由key/value组成的对象,包含了动态片段和全匹配片段,如果路由没有传参,就是一个空对象
3、$route.query
由key/value组成的对象,表示URL查询参数
例如 /login?user=zs,则$route.query.user==zs 如果没有传查询参数则是一个空对象
4、$route.hash
当前路由的的hash值,如果没有hash值,则为空字符串
5、$route.fullPath
完成解析后的URL,包含查询参数和hash的完整路径
6、$route.matched
数组,包含当前匹配的路径中所包含的所有片段所对应的配置参数对象
7、$route.name
当前路径名字
$router
1、$router.push
字符串
this.$router.push('login')
对象
this.$router.push({path:'login'})
命名的路由
this.$router.push({name:'zs',params:{age:20}})
变成/zs/20
带查询参数
this.$router.push({path:'login',query:{username:'zs'}})
变成/login?username=zs
2、go
页面路由跳转 前进或者后退
this.$router.go(-1) 后退
3、replace
push方法会向history栈添加一个新的记录,而replace方法是替换当前的页面,不会向history栈添加一个新的记录
一般使用replace来做404页面
this.$router.replace('/')
配置路由的时候path有时候会加'/'有时候不加,以'/'开头的会被当做根路径,就不会一直嵌套之前的路径
$route和$router的区别
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。
推荐阅读更多精彩内容
- vue-router中$route和$router的区别 $router: 代表的是路由器对象,包含一些实...
- 一句话概括:route。 $route,一个对象,里面包括一次跳转需要的路由信息。 $router,路由管理器,其...