共同点:

1、都可以传值

2、在另外一个组件中传递值的时候，都是放在$route中

不同点:

    1、传值时候，url的表现不一样

        query   /orderInfo?xxx=yyy&aaa=bbb

        params /orderInfo/yyy/bbb

    2、设置路由规则的时候不一样

        query  path:/orderInfo

        params path:/orderInfo/:orderId/:goodsId

    3、获取值的方式不一样

        query this.$route.query.orderId

        params this.$route.params.orderId

vue中params & query的比较的更多相关文章

  1. vue router使用query和params传参的使用

    传参是前端经常需要用的一个操作,很多场景都会需要用到上个页面的参数,本文将会详细介绍vue router 是如何进行传参的,以及一些小细节问题.有需要的朋友可以做一下参考,希望可以帮到大家. Vue ...

  2. （转）vue router 如何使用params query传参，以及有什么区别

    写在前面: 传参是前端经常需要用的一个操作,很多场景都会需要用到上个页面的参数,本文将会详细介绍vue router 是如何进行传参的,以及一些小细节问题.有需要的朋友可以做一下参考,喜欢的可以点波赞 ...

  3. 【原】vue-router中params和query的区别

    1.引入方式不同 query要用path来引入 this.$router.push({ path: 'test', query: { type: 2, detail: '哈哈' } }) params ...

  4. vue router 如何使用params query传参，以及有什么区别

    写在前面: 传参是前端经常需要用的一个操作,很多场景都会需要用到上个页面的参数,本文将会详细介绍vue router 是如何进行传参的,以及一些小细节问题.有需要的朋友可以做一下参考,喜欢的可以点波赞 ...

  5. vue中的路由的跳转的参数

    vue中的路由跳转传参 params 与 query this.$router.push({ name:"detail", params:{ name:'nameValue', c ...

  6. vue中Axios的封装和API接口的管理

    前端小白的声明: 这篇文章为转载:主要是为了方便自己查阅学习.如果对原博主造成侵犯,我会立即删除. 转载地址:点击查看 如图,面对一团糟代码的你~~~真的想说,What F~U~C~K!!! 回归正题 ...

  7. vue中$route 和$router的区别

    在vue中会出现一种情况 const url=this.$route.query.returnURL; this.$router.push(url);    $router和$route的区别傻傻的分 ...

  8. Vue中router两种传参方式

    Vue中router两种传参方式 1.Vue中router使用query传参 相关Html: <!DOCTYPE html> <html lang="en"> ...

  9. vue中axios的深入使用

    如上所示一条简单的请求数据,用到了vue中axios,promise,qs等等 这里我将vue中用到的axios进行了封装方便日后使用  先对工具类进行封装utils/axios.js: // 引入模 ...

随机推荐

  1. POJ3581 Sequence —— 后缀数组

    题目链接:https://vjudge.net/problem/POJ-3581 Sequence Time Limit: 5000MS   Memory Limit: 65536K Total Su ...

  2. 分享知识-快乐自己：SpringBoot 使用注解API的方式定义启动端口号

    在Spring Boot2.0以上配置嵌入式Servlet容器时EmbeddedServletContainerCustomizer类不存在,经网络查询发现被WebServerFactoryCusto ...

  3. 用python 实现录入学生作业情况的小程序

    写一个录入学生作业情况的一个程序 1.查看学生作业情况 2.录入学生作业情况 3.可以让输入3次,需要为空的情况 homeworks = { ‘张流量’: {‘2018.3.22’:”未交”,’201 ...

  4. CodeForces - 697F：Legen... （AC自动机+矩阵）

    Barney was hanging out with Nora for a while and now he thinks he may have feelings for her. Barney ...

  5. AtCoder Grand Contest #026 C - String Coloring

    Time Limit: 3 sec / Memory Limit: 1024 MB Score : 600600 points Problem Statement You are given a st ...

  6. 数据结构与算法（2）----->字符串

    1. 字符串的一些特点 1.1  广泛性 (1)字符串可以看作是字符类型的数组----->所以可能会涉及排序+查找; (2)很多问题都可以转化为字符串类型的方法去解决; 需要注意的是:用java ...

  7. mysql建表练习

    create table class( cid int primary key auto_increment, caption ) not null )engine=innodb; create ta ...

  8. 如何使用代码美化器Uncrustify (How to use code beautifier Uncrustify)

    1.下载NodePad++, 2.选择菜单Plugins/Plugin Manager/Show Plugin Manager 3.勾选UniversalIndentGUI,点击Install 4.下 ...

  9. POJ(有向图求LCA)

    Closest Common Ancestors Time Limit: 2000MS   Memory Limit: 10000K Total Submissions: 18013   Accept ...

  10. Advanced R之编程风格

    转载请注明出处,谢谢.   编程风格指导 好的编码风格如同正确使用标点符号一样重要.没有编码规范仍然可以管理代码,但是有代码规范会使代码更易阅读.如同标点样式,编码规范也有不同.下面描述的是我所使用的 ...