$router是路由对象,是一个只写的对象

$route是当前路由的信息对象,是一个只读的对象

带参数路由跳转

1 query参数,这个是作为字符串拼接在url的后面,跟路由没有关系,demo:list/user没有也正常的路由到正确的路径。相当于get请求,请求的参数会在地址栏显示,可以用name或者path来引入路由,使用this.$route.query获取query对象中的参数

2 params参数,需要在路由中明确声明出来:demo:/list/user/:id,这个路由必须带上id参数,不然路由无法跳转(vue-cli3的项目中),参数是路由的一部分,

必须在路由后面带上参数名。相当于是post请求,参数在url中不显示,必须使用name来引入路由,如果使用path来引入,在第一次进入页面时rhis.$route.params.id可以获取到参数,页面刷新之后就成undifined了

vue-router parmas与query的区别的更多相关文章

  1. (转)vue router 如何使用params query传参,以及有什么区别

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

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

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

  3. vue路由传值params和query的区别

    vue路由传值params和query的区别1.query传参和接收参数传参: this.$router.push({ path:'/xxx' query:{ id:id } })接收参数: this ...

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

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

  5. $router和$route的区别,路由跳转方式name 、 path 和传参方式params 、query的区别

    一.$router和$route的区别 $router : 是路由操作对象,只写对象$route : 路由信息对象,只读对象 例子://$router操作 路由跳转 this.$router.push ...

  6. vue router & query params

    vue router & query params vue router get params from url https://zzk.cnblogs.com/my/s/blogpost-p ...

  7. vue router 跳转到新的窗口方法

    在CreateSendView2.vue 组件中的方法定义点击事件,vue router 跳转新的窗口通过采用如下的方法可以实现传递参数跳转相应的页面goEditor: function (index ...

  8. Vue技术点整理-Vue Router

    路由 Vue Router 对于单页面应用来说,如果涉及到多个页面的话,就必须要使用到路由,一般使用官方支持的 vue-router 库 一,Vue Router 在项目中的安装引用 1,在页面中使用 ...

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

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

随机推荐

  1. DVWA-弱会话ID

    本周学习内容: 1.学习web安全深度剖析: 2.学习安全视频: 3.学习乌云漏洞: 4.总结Web应用安全权威指南: 实验内容: 进行DVWA弱会话ID实验 实验步骤: Low 1.打开DVWA,进 ...

  2. javascript之大文件分段上传、断点续传

    这里只写后端的代码,基本的思想就是,前端将文件分片,然后每次访问上传接口的时候,向后端传入参数:当前为第几块文件,和分片总数 下面直接贴代码吧,一些难懂的我大部分都加上注释了: 上传文件实体类: 看得 ...

  3. CSS3 过渡 (transition )

    transition 属性是一个简写属性,用于设置四个过渡属性: 1.transition-property   设置过渡效果的 CSS 属性的名称.一般写all 2.transition-durat ...

  4. swiper插件的一些坑

    最近正在做一个PC端和移动端的项目 正好用到了swiper 今天给大家拿来讲讲 swiper的官网http://www.swiper.com.cn/ 博主用的是4.0的版本 如果大家用的是3.0的版本 ...

  5. web表单

    1.配置 使用Flask-WTF, 它集成了WTForms并且完美地集成到了flask. 在microblog根目录下创建一个文件,存储flask扩展的所有配置,CSRF_ENABLED用于激活跨站点 ...

  6. Linux下的Memcache安装 和 安装Memcache的PHP扩展

    一.首先安装服务端memcached 1.下载libevent与memcache软件包. 下载memcached: wget http://memcached.org/latestwget http: ...

  7. C利用可变参数列表统计一组数的平均值,利用函数形式参数栈原理实现指针运算

    //描述:利用可变参数列表统计一组数的平均值 #include <stdarg.h> #include <stdio.h> float average(int num, ... ...

  8. CODE FESTIVAL 2016 qual C题解

    传送门 \(A\) 什么玩意儿-- const int N=105; char s[N];int n,f1,f2; int main(){ scanf("%s",s+1),n=st ...

  9. TCP协议怎么工作的?

    三次握手过程: 第一次 第一次握手:建立连接时,客户端发送syn包(syn=j)到服务器,并进入SYN_SENT状态,等待服务器确认:SYN:同步序列编号(Synchronize Sequence N ...

  10. element ui table组件自定义合计栏,后台给的数据

    合计的数据是后台传的,所以用table组件自定义一行用来合计 <el-table border fit v-loading.body="listLoading" elemen ...