$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. MySQL 效率提高N倍的19条MySQL优化秘籍

    一.EXPLAIN 做MySQL优化,我们要善用 EXPLAIN 查看SQL执行计划. 下面来个简单的示例,标注(1,2,3,4,5)我们要重点关注的数据 type列,连接类型.一个好的sql语句至少 ...

  2. MySQL UTF8 转为 utf8mb4

    https://mathiasbynens.be/notes/mysql-utf8mb4#utf8-to-utf8mb4 How to support full Unicode in MySQL da ...

  3. WebAPI学习

    WebAPI概述 今天的web计算平台包含了广泛的功能,其中的大部分均可以通过API(应用程序编程接口)访问. web平台归为6个基本设施,都会用到webapi,包括存储服务.消息服务.计算服务.信息 ...

  4. 83: 模拟赛 树形dp

    $des$ $sol$ 维护每个点的子树中的信息以及非子树的信息 $code$ #include <bits/stdc++.h> using namespace std; #define ...

  5. C#实现上传/下载Excel文档

    要求 环境信息:WIN2008SERVER  开发工具:VS2015 开发语言:C# 要求: 1.点击同步数据后接口获取数据展示页面同时过滤无效数据并写入数据库,数据可导出Excel并支持分类导出 2 ...

  6. 最长升序列 DP

    class Solution: def lengthOfLIS(self,nums): if not nums:return 0 #边界处理 dp = [1 for _ in range(len(nu ...

  7. 42、JDBC数据源案例

    一.JDBC数据源案例 1.概述 Spark SQL支持使用JDBC从关系型数据库(比如MySQL)中读取数据.读取的数据,依然由DataFrame表示,可以很方便地使用Spark Core提供的各种 ...

  8. Comet OJ - Contest #11题解

    传送门 \(A\) 咕咕咕 const int N=1e6+5; char s[N],t[N];int n,res; inline bool cmp(const int &x,const in ...

  9. vmware exsi安装部署

    本文章参考:https://blog.csdn.net/fishinhouse/article/details/80980051 1.VMware-ESXi-6.5.0镜像下载 网盘链接:https: ...

  10. Win10安装PyQt5与Qt Designer【转】

    https://blog.csdn.net/u011342224/article/details/78879633 1.直接在cmd中通过pip安装PyQt5 1 pip install pyqt5 ...