<template>
<a @click="goNext">Next</a>
<input type="text" v-model="year"/>
<input type="text" v-model="day"/>
</template> <script>
export default {
data() {
rerurn {year: '', day: ''}
},
methods: {
goNext() {
this.$router.push({name: 'test', params: {year: this.year, day: this.day}})
}
}
}
</script>

A页面传递

<template>
<div>{{this.$route.params.year}}{{this.$route.params.day}}</div>
</template>

B页面接收

{
path: '/test',
name: 'test',
component: Test
}

修改router的index.js

如果还看不明白,参考:https://www.cnblogs.com/WQLong/p/7804215.html、https://blog.csdn.net/qq_15646957/article/details/78070862

反正我是看了这才明白的。

VUE,页面跳转传多个参数的更多相关文章

  1. vue 页面跳转传参

    页面之间的跳转传参,正常前端js里写 window.location.href="xxxxx?id=1" 就可以了: 但是vue不一样 需要操作的是路由history,需要用到 V ...

  2. vue页面跳转传参

    跳转页 this.$router.push({name:'路由命名',params:{参数名:参数值,参数名:参数值}}) 接收页 this.$route.params.参数名

  3. 用jQuery.ajaxWebService请求WebMethod,Ajax处理实现局部刷新;及Jquery传参数,并跳转页面 用post传过长参数

    首先在aspx.cs文件里建一个公开的静态方法,然后加上WebMethod属性. 如: [WebMethod]  public static string GetUserName()   {  //. ...

  4. 小程序页面跳转传参-this和that的区别-登录流程-下拉菜单-实现画布自适应各种手机尺寸

    小程序页面跳转传参 根目录下的 app.json 文件 页面文件的路径.窗口表现.设置网络超时时间.设置多 tab { "pages": [ "pages/index/i ...

  5. Vue页面跳转动画效果实现

    Vue页面跳转动画效果实现:https://juejin.im/post/5ba358a56fb9a05d2068401d

  6. vue页面跳转以及传参和取参

    vue中this.$router.push()路由传值和获取的两种常见方法 1.路由传值   this.$router.push() (1) 想要导航到不同的URL,使用router.push()方法 ...

  7. vue:页面跳转和传参(页面之间,父传子,子传父)

    1.返回上一个页面: A.<a @click="$router.back(-1)" class="btn">重新加载</a> B.thi ...

  8. vue 中 this.$router.push() 路由跳转传参 及 参数接收的方法

    传递参数的方法:1.Params 由于动态路由也是传递params的,所以在 this.$router.push() 方法中 path不能和params一起使用,否则params将无效.需要用name ...

  9. VUE页面跳转方式

    一.to +跳转路径 <router-link to="/">跳转到主页</router-link> <router-link :to="{ ...

随机推荐

  1. sonar的安装以及使用

    SonarQube是管理代码质量一个开放平台,可以快速的定位代码中潜在的或者明显的错误,下面将会介绍一下这个工具的安装.配置以及使用. 1. 简介 1.  sonar是什么 Sonar是一个用于代码质 ...

  2. C++中的static关键字总结

    C++的static有两种用法:面向过程程序设计中的static和面向对象程序设计中的static.前者应用于普通变量和函数,不涉及类:后者主要说明static在类中的作用. 1.面向过程设计中的st ...

  3. 一言难尽的js变量提升

    基础知识  在这个课题开始之前我们先做一些基础知识的讲解 1.在顶级的区域内声明的变量为 window级别的变量. 也就是说var a=100 等价于 window.a=100; 2.局部的重新声明变 ...

  4. $resource详解

    $resource 首先添加$resource的引用 <script src="Scripts/angular.min.js"></script> < ...

  5. Nginx range filter模块数字错误漏洞修复 (Nginx平滑升级) 【转】

    对线上生产环境服务器进行漏洞扫描, 发现有两台前置机器存在Nginx range filter模块数字错误漏洞, 当使用nginx标准模块时,攻击者可以通过发送包含恶意构造range域的header ...

  6. requests库入门11-重定向和请求历史

    默认情况下,除了head请求,requests会自动处理重定向 重定向就是会把url重新指定到另一个.比如github,使用http会自动重定向到https.一些公司也会使用网关啥的做重定向. r = ...

  7. Mybatis--02

    主要内容: 1 输入映射和输出映射 输入参数映射 返回值映射 2 动态sql if where foreach sql片段 3 关联查询 一对一关联 一对多关联 4 整合Spring #{}代表一个占 ...

  8. python初始化环境记录

    初始化python环境:yum install -y gcc libffi-devel python-devel openssl-devel gcc-c++yum install -y python- ...

  9. nginx负载均衡优化配置

    针对nginx做负载均衡时其中一台服务器挂掉宕机时响应速度慢的问题解决 nginx会根据预先设置的权重转发请求,若给某一台服务器转发请求时,达到默认超时时间未响应,则再向另一台服务器转发请求. 默认超 ...

  10. datepicker 属性设置 以及方法和事件

    DatePicker支持鼠标点选日期,同时还可以通过键盘控制选择: page up/down - 上一月.下一月 ctrl+page up/down - 上一年.下一年 ctrl+home - 当前月 ...