浅析vue-router中params和query的区别
1.引入方式不同
query要用path来引入
this.$router.push({ path: 'test', query: { type: 2, detail: '哈哈' } })
params要用name来引入
this.$router.push({ name: 'test', query: { type: 2, detail: '哈哈' } })
2.url不同
query在url中显示参数
http://localhost:8080/detail?type=0&detail=哈哈
params在url中不显示参数
http://localhost:8080/detail
下面整理一下这两者的差别:
1、用法上的
刚才已经说了,query要用path来引入,params要用name来引入,接收参数都是类似的,分别是this.$route.query.name和this.$route.params.name。
注意接收参数的时候,已经是$route而不是$router了哦!!
2、展示上的
query更加类似于我们ajax中get传参,params则类似于post,说的再简单一点,前者在浏览器地址栏中显示参数,后者则不显示
query:
params:
总结
以上所述是小编给大家介绍的vue-router中params和query的区别,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对我们网站的支持!
如果你觉得本文对你有帮助,欢迎转载,烦请注明出处,谢谢!
栏 目:JavaScript
本文标题:浅析vue-router中params和query的区别
本文地址:https://www.xiuzhanwang.com/a1/JavaScript/9405.html
您可能感兴趣的文章
- 04-02javascript匿名,js匿名方法
- 04-02java中间代码生成器 java自动生成代码工具
- 01-10在Vue项目中使用Typescript的实现
- 01-10Vue中使用Lodop插件实现打印功能的简单方法
- 01-105分钟快速看懂ES6中的反射与代理
- 01-10vue中根据时间戳判断对应的时间(今天 昨天 前天)
- 01-10JavaScript中的相等操作符使用详解
- 01-10javascript中的相等操作符(==与===区别)
- 01-10vue实现拖拽效果
- 01-10判断JavaScript中的两个变量是否相等的操作符
阅读排行
本栏相关
- 04-02javascript点线,点线的代码
- 04-02javascript潜力,javascript强大吗
- 04-02javascript替换字符串,js字符串的替换
- 04-02javascript移出,js 移入移出
- 04-02包含javascript舍的词条
- 04-02javascript并行,深入理解并行编程 豆瓣
- 04-02javascript匿名,js匿名方法
- 04-02javascript警报,JavaScript警告
- 04-02javascript遮盖,JavaScript遮盖PC端页面
- 04-02javascript前身,javascript的前身
随机阅读
- 01-10delphi制作wav文件的方法
- 08-05织梦dedecms什么时候用栏目交叉功能?
- 01-10使用C语言求解扑克牌的顺子及n个骰子
- 04-02jquery与jsp,用jquery
- 01-10C#中split用法实例总结
- 08-05DEDE织梦data目录下的sessions文件夹有什
- 01-11Mac OSX 打开原生自带读写NTFS功能(图文
- 01-10SublimeText编译C开发环境设置
- 01-11ajax实现页面的局部加载
- 08-05dedecms(织梦)副栏目数量限制代码修改