//query传参,使用name跳转

  this.$router.push({
       name:'second',
       query: {
         queryId:'20180822',
         queryName: 'query'
       }
  })

 //query传参,使用path跳转
   this.$router.push({
      path:'second',
      query: {
        queryId:'20180822',
        queryName: 'query'
      }
  })

//params传参,使用name跳转

   this.$router.push({
     name:'Lineitem',
     params: {
     name: 'admin',
     vade: row.orderId,
     mode: row.otherOrderId
    }
  })
//接收使用得参数
  mounted() {
     this.queryParam.phoneSerial = this.$route.params.node
     this.queryParam.otherOrderId = this.$route.params.mode
     console.log('this.$route.params', this.$route)
     this.queryParam.accountId = this.$route.params.code;
  },
console.log('this.$route.params', this.$route)
查看传值内容

使用query传值是在地址后面拼接,params传值是直接使用

需要注意的是:

params是路由的一部分,必须要在路由后面添加参数名。query是拼接在url后面的参数,没有也没关系。
params一旦设置在路由,params就是路由的一部分,如果这个路由有params传参,但是在跳转的时候没有传这个参数,会导致跳转失败或者页面会没有内容。

vue传参方式的更多相关文章

  1. vue的传参方式和router使用技巧

    vue传参方法一 1,路由配置 { path: '/describe/:id', name: 'Describe', component: Describe } 2,使用方法 // 直接调用$rout ...

  2. Vue Router路由导航及传参方式

    路由导航及传参方式 一.两种导航方式 ①:声明式导航 <router-link :to="..."> ②:编程式导航 router.push(...) 二.编程式导航参 ...

  3. Vue-router的传参方式和router使用技巧

    vue传参方法一 1,路由配置 { path: '/describe/:id', name: 'Describe', component: Describe } 2,使用方法 // 直接调用$rout ...

  4. angularjs简单实现$http.post(CORS)跨域及$http.post传参方式模拟jQuery.post

    1.开启angularjs的CORS支持 .config(function($httpProvider) { // CORS post跨域配置 $httpProvider.defaults.useXD ...

  5. react中的传参方式

    react是一个SPA模式,即组件嵌套租,在一个单页面的应用中组件间的数值传递是必不可少的,主要的传参方式大致有一下几种: 1,在挂载的地方给组件传参 ReactDOM.rander(<a na ...

  6. Web API中的传参方式

    在Restful风格的WebApi的里面,API服务的增删改查,分别对应着Http Method的Get / Post / Delete /Put,下面简单总结了Get / Post /Delete ...

  7. jQuery对象初始化的传参方式

    jQuery对象初始化的传参方式包括: 1.$(DOMElement) 2.$(' ... '), $('#id'), $('.class') 传入字符串, 这是最常见的形式, 这种传参数经常也传入第 ...

  8. Python函数定义及传参方式

    主要内容:     1.函数初识     2.函数传参方式        (1)位置参数        (2)默认参数        (3)关键参数        (4)非固定传参 一.函数初识 1. ...

  9. java 传参方式--值传递还是引用传递

    java 传参方式--值传递还是引用传递 参数是按值而不是按引用传递的说明 Java 应用程序有且仅有的一种参数传递机制,即按值传递.写它是为了揭穿普遍存在的一种神话,即认为 Java 应用程序按引用 ...

随机推荐

  1. [ 头皮发麻 A1 ] 队内赛3 2020 Ateneo de Manila University DISCS PrO HS Division

    都是英语阅读题 但是本菜鸡就过了一题,直接自闭mmp明天开始起床一版题 传送门 B.Riana and the Blind Date 0是闰年?惊了 后来才知道整除被除数可以为0 闰年的计算方法 \( ...

  2. oracle包package的使用

    创建包 包头: CREATE OR REPLACE PACKAGE test_pkg IS PROCEDURE update_sal(e_name VARCHAR2,newsal NUMBER);  ...

  3. ElasticSearch--validate验证搜索语句是否合法或者存在语法错误

    GET /accounts/person/_validate/query?explain { "query":{ "match": { "user&q ...

  4. 尚学堂 216 java中的字节码操作

    所谓的字节码操作就是操作我们已经加载的字节码 接下来我们重点来讲解javaassist类库 使用需要下载jar包,把jar包添加到对应的工程之后 package com.bjsxt.test; pub ...

  5. 使用docker创建rabbitMQ容器

    1.拉去镜像 docker pull rabbitmq:3.7.7-management

  6. P1131 [ZJOI2007]时态同步【树形dp】

    时态同步 从叶子到根节点统计修改次数.树形\(dp\)思想. 题目描述 小\(Q\)在电子工艺实习课上学习焊接电路板.一块电路板由若干个元件组成,我们不妨称之为节点,并将其用数字\(1,2,3-\). ...

  7. 一.5.序列化应用之服务器制造厂与型号app功能

    1.环境准备: (python36env) [vagrant@CentOS7 apps]$ django-admin startapp manufacturer (1)激活:'manufacturer ...

  8. 每日一题 - 剑指 Offer 33. 二叉搜索树的后序遍历序列

    题目信息 时间: 2019-06-26 题目链接:Leetcode tag:分治算法 递归 难易程度:中等 题目描述: 输入一个整数数组,判断该数组是不是某二叉搜索树的后序遍历结果.如果是则返回 tr ...

  9. 微信解密encryptedDataStr获取用户信息

    A:<button open-type="getPhoneNumber" bindgetphonenumber="getPhoneNumber">& ...

  10. day14 参数

    目录 一.参数介绍 二.形参与实参的具体使用 2.1位置参数 2.2关键字参数 2.3关键字实参和位置实参混合使用时 2.4默认参数 2.5位置形参和默认形参混用 2.6 可变长度的参数(*与**用法 ...