$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. 2019-2020-1 20199302《Linux内核原理与分析》第二周作业

    一.实验记录 1.实验代码截屏 本次实验中遇到的一个小问题是: (1)在进行汇编语言编译时,命令行本应是"g/.s*/d ",因为做实验的时候还没有看视频,只是看了书,把" ...

  2. CentOS6.5 安装ES5.5

    一.CURL查看已开启的ES es5.5:elasticsearch-5.5.2.tar.gz下载,百度云地址 https://pan.baidu.com/s/17oFOQlePLtUhhJHxEPR ...

  3. go get 无反应方法 Win/Linux 命令行、终端和 Git 代理设置

    go get -u -v 无反应方法 CMD要用管理员权限运行,否则设置无效 netsh winhttp set proxy proxy-server="https=127.0.0.1:10 ...

  4. mac Understand 安装破解

    下载:链接:https://pan.baidu.com/s/1UvxgFnjv9pRVJmZO-J2OrQ  密码:nyd4 启动后,开始激活,点击enter License code 点击“use ...

  5. BufferedReader和BufferedWriter简介

    BufferedReader和BufferedWriter简介 为了提高字符流读写的效率,引入了缓冲机制,进行字符批量的读写,提高了单个字符读写的效率.BufferedReader用于加快读取字符的速 ...

  6. 网络IPC：套接字接口概述

    网络IPC:套接字接口概述 套接字接口实现了通过网络连接的不同计算机之间的进程相互通信的机制. 套接字描述符(创建套接字) 套接字是通信端点的抽象,为创建套接字,调用socket函数 #include ...

  7. comparison of truncate vs delete in mysql/sqlserver

    comparison of truncate vs delete in mysql/sqlserver [duplicate]   DELETE DELETE is a DML Command. DE ...

  8. 【转】禁用chrome firefox 的 WebRTC功能防止真实IP泄漏

    无论是使用VPN还是其它代理方式,很多时候我们不希望暴露自己的真实IP,且一直以来我们认为VPN是安全的,所有流量都会走VPN. 但最近暴露出一个WebRTC特性,会暴露我们的真实IP.适用浏览器:c ...

  9. make 实例 二 V56

    ######################################################################### # # Makefile used for buil ...

  10. jvm 命令使用调优 通过jstat、jmap对java程序进行性能调优

    转载:http://blog.csdn.net/jerry024/article/details/8507589 转载: https://blog.csdn.net/zhaozheng7758/art ...