$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. 运算符 & | ^ ~ >> << 讲解

    字节”是byte,“位”是bit :1 byte = 8 bit : char 在java中是2个字节.java采用unicode,2个字节(16位)来表示一个字符. char 16位2个字节 byt ...

  2. linux学习7 Linux文件系统功能和作用详解

    一.终端 1.用户界面 GUI: GNome KDE CLI: bash,zsh,sh,csh,tcsh,ksh 2.远程连接 a.ssh协议. 查看系统是否监听于tcp协议的22号端口: ss  - ...

  3. qDeleteAll与clear

    qDeleteAll:专门用于指针容器,对容器或者迭代器中的每个对象进行delete操作,而不是从容器中移除对象.源代码如下: void qDeleteAll(ForwardIterator begi ...

  4. editplus 支持lua语言语法高亮显示

    找到自己的安装目录 建一个这个名字的文件 里面写上 #TITLE=LUA ; LUA syntax file written by ES-Computing. ; This file is requi ...

  5. StringSequences

    题意: 给出两个长度不超过\(50\)的字符串\(S, T\),每次可以在\(S\)中插入一个字符,把每次操作后的\(S\)写成一个序列,问有多少种不同的序列. 注意到我们可以把\(S\)拆分成一段一 ...

  6. TFRecord 使用

    tfrecord生成 import os import xmltodict import tensorflow as tf import numpy as np dir_path = 'F:\数据存储 ...

  7. 42、JDBC数据源案例

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

  8. 64位内核开发第四讲,查看SSDT表与showSSDT表

    目录 SSDt表与ShadowSSDT表的查看. 一丶SSDT表 1.什么是SSDT表 2.查看步骤 二丶ShadowSSDT表 1.什么是ShadowSSDT表 2.如何查看. 三丶工具介绍 SSD ...

  9. C 库函数 - strchr()

    定义 char *strchr(const char *str, int c) 参数 str -- 要被检索的 C 字符串. c -- 在 str 中要搜索的字符 说明 该函数返回在字符串 str 中 ...

  10. [luogu 3803]【模板】多项式乘法

    传送门 FFT #include<bits/stdc++.h> #define ll long long #define max(a,b) ((a)>(b)?(a):(b)) #de ...