前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >vue2.0的三种路由传参方式

vue2.0的三种路由传参方式

作者头像
我乃小神神
发布2019-03-20 15:15:37
2.6K0
发布2019-03-20 15:15:37
举报
文章被收录于专栏:前端基础前端基础

为了方便自己查看,也许也能方便你学习,所以写一下

vue路由跳转不外乎就三种,其实还有一种就是js 的跳转方式

https://router.vuejs.org/ vue-router官网文档,相信有些同学不喜欢看官网,觉得说的云里雾里的

第一种,这个用的比较少,因为需要在路由配置

路由跳转第一种方式
路由跳转第一种方式

对应的路由配置如下

路由配置
路由配置
代码语言:javascript
复制
     this.$route.params.sessionId     第一种取参数的方式

第二种就用的比较多了

代码语言:javascript
复制
       this.$router.push({
          name: 'index',
          params: {
            id: id
          }
        })
代码语言:javascript
复制
     this.$route.params.id    第二种取参数的方式和第一种一样

params中是携带参数的,就相当于post一样,不会暴露出你传递的参数,name就是你路由配置中的对应路由的name (名字)

第三种路由传递参数方式了

代码语言:javascript
复制
  this.$router.push({
          path: '/describe',
          query: {
            id: id
          }
        })

这种就相当于get 传递参数,会把你的参数暴露出来

代码语言:javascript
复制
     this.$route.query.id   第三种取参数的方式

有没有想了解基于vue的即时通讯的啊,我会后面分享的哦,谢谢

本文参与 腾讯云自媒体分享计划,分享自作者个人站点/博客。
原始发表:2018年12月05日,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体分享计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 为了方便自己查看,也许也能方便你学习,所以写一下
相关产品与服务
即时通信 IM
即时通信 IM(Instant Messaging)基于腾讯二十余年的 IM 技术积累,支持Android、iOS、Mac、Windows、Web、H5、小程序平台且跨终端互通,低代码 UI 组件助您30分钟集成单聊、群聊、关系链、消息漫游、群组管理、资料管理、直播弹幕和内容审核等能力。适用于直播互动、电商带货、客服咨询、社交沟通、在线课程、企业办公、互动游戏、医疗健康等场景。
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档