博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
vue中this.$router.push()传参简单说明
阅读量:5916 次
发布时间:2019-06-19

本文共 685 字,大约阅读时间需要 2 分钟。

在项目开发过程中,我发现很多新加入项目组的前端开发,去写this.$router.push()传参时,都存在一个共性问题,代码如下: 

this.$router.push({    path: 'register',    name:'register',     params: { plan: 'private' }}) 复制代码
这么写显然是不对的,对于this.$router.push()传参,我在项目一般使用以下两种方式:

1、使用params传参,例:

this.$router.push({ name: 'user', params: { userId: 123 }})复制代码

注意⚠️:patams传参 ,路径不能使用path 只能使用name,借用vue官方文档的一句话,this will not work。

获取参数,例:

this.$route.params.userId复制代码

2、使用query传参,例:

this.$router.push({ path: '/user', query: { userId: 123}})复制代码

注意⚠️:如果写成:

this.$router.push({ path: '/user', params: { userId: 123 }}) 复制代码

这样依然借用vue官方文档的一句话:this will not work。

获取参数,例:

this.$route.query.userId复制代码

转载于:https://juejin.im/post/5bfd4d826fb9a04a0730100a

你可能感兴趣的文章
RedHat已更改其开源许可规则
查看>>
redis集群搭建
查看>>
LNMP架构 (Ⅱ)——nginx相关配置、nginx代理
查看>>
神级python程序员只需要一个公众号,再也不会错过重要资讯
查看>>
双十一流量洪峰 支撑阿里核心业务的云数据库揭秘
查看>>
OSChina 周一乱弹 ——程序员跟产品经理撕逼必须掌握的套路
查看>>
Linux系统启动流程详解
查看>>
Magento(CE1.X)自带模块解析五
查看>>
Factory Method模式 (一)
查看>>
代码整洁之道-第9章-单元测试-读书笔记
查看>>
C++ ssd5 12 optional exercise2
查看>>
如何调用带返回值类型的函数
查看>>
linux网络编程涉及的函数
查看>>
数据表的相关操作
查看>>
POJ 2594 Treasure Exploration(最小可相交路径覆盖)题解
查看>>
数据挖掘十大经典算法
查看>>
ArcGIS API for Silverlight 调用GP服务加载等值线图层
查看>>
CentOS系统rsync文件同步 安装配置
查看>>
LogStash配置、使用(三)
查看>>
SpringMVC 学习笔记(二) @RequestMapping、@PathVariable等注解
查看>>