P13.11-VueRouter路由$route和$router区别

举报
brucexiaogui 发表于 2021/11/25 23:37:19 2021/11/25
【摘要】 P13.11-VueRouter路由$route和$router区别 1.概述 $route和$router区别总结 $router为VueRouter实例,想要导航到不同URL,则使用$r...

P13.11-VueRouter路由$route和$router区别

1.概述

$route和$router区别总结

  • $router为VueRouter实例,想要导航到不同URL,则使用$router.push方法
  • $route为当前router跳转对象里面可以获取name、path、query、params等

2.$route和$router区别

2.1.查看router对象的来龙去脉

在user.vue中通过按钮输出router对象和main.js中打印import router from ‘./router’ 导入indexjs文件中创建的对象,发现他们是同一个对象,都是index.js文件中创建的router对象。

  • 在user.vue中打印router对象
    在这里插入图片描述
  • 在main.js文件中打印router对象
    在这里插入图片描述
  • 对比两个地方打印的router是同一个对象
    在这里插入图片描述
  • 查看router对象源文件
    在这里插入图片描述
    在这里插入图片描述

2.2.查看route对象的来龙去脉

  • 在User.vue中打印route
    在这里插入图片描述
  • 查看route对象

route对象中显示当前活跃路由组件中的数据
在这里插入图片描述

文章来源: brucelong.blog.csdn.net,作者:Bruce小鬼,版权归原作者所有,如需转载,请联系作者。

原文链接:brucelong.blog.csdn.net/article/details/111868218

【版权声明】本文为华为云社区用户转载文章,如果您发现本社区中有涉嫌抄袭的内容,欢迎发送邮件进行举报,并提供相关证据,一经查实,本社区将立刻删除涉嫌侵权内容,举报邮箱: cloudbbs@huaweicloud.com
  • 点赞
  • 收藏
  • 关注作者

评论(0

0/1000
抱歉,系统识别当前为高风险访问,暂不支持该操作

全部回复

上滑加载中

设置昵称

在此一键设置昵称,即可参与社区互动!

*长度不超过10个汉字或20个英文字符,设置后3个月内不可修改。

*长度不超过10个汉字或20个英文字符,设置后3个月内不可修改。