1) 在router文件下的index.js中,添加相关路径

routes: [
{
path: '/',
name: 'Hello',
component: HelloWorld
},
{
path:"/paramsUrl",
component:paramsUrl
}
]

2) 在HelloWorld组件中传递参数,这里用的是点击事件跳转

this.$router.push({path:"/paramsUrl",query:{name:'Tom',age:18,sex:'male'}})

在paramsUrl组件中可以在url中看到

http://localhost:8080/#/paramsUrl?name=Tom&age=18&sex=nan

获取参数方法

this.$route.query

注意:如果在router中有那么参数,只需要将第二步中path替换成name即可

Vue:不同页面之间的传递参数(二)---query的更多相关文章

  1. Vue:不同页面之间的传递参数--params

    在嵌套vue-router情况下,不同页面之间传递参数可以通过params实现.而params传参分为两种情况: 1.参数在url中显示 首先你要确定自己要传的参数,并在控制路由的文件中的Router ...

  2. js两个页面之间URL传递参数中文乱码

  3. jsp页面之间传中文参数显示乱码问题的解决

    最近在项目中遇到jsp页面通过url传递参数,出现乱码,但是在本地是正常显示,在服务器上却是乱码,找了好久都没找到解决方法,最终在大神的帮助下解决了这个问题 比如从a.jsp像b.jsp页面传递参数 ...

  4. jQuery Mobile学习之grid、等待显示的ajax效果、页面跳转、页面跳转传递参数等(二)

    Index.cshtml <!-- Start of second page --> <section data-role="page" id="bar ...

  5. vue 路由 及 跳转传递参数的总结

    博客地址:https://ainyi.com/4 vue-router vue-router 是Vue.js官方的路由插件,它和vue.js是深度集成的,适合用于构建单页面应用.vue的单页面应用是基 ...

  6. 转载如何实现portlet之间的传递参数

    Liferay 6开发学习(三十):跨页面Portlet之间的调用与数据传递 2014年10月09日 Liferay 评论 2 条 阅读 4,209 views 次 Portlet之间的通信方法有多种 ...

  7. [转] 微信小程序 页面跳转 传递参数

    本文转自:http://blog.csdn.net/qq_31383345/article/details/52795212 微信小程序的页面跳转,页面之间传递参数笔记. CSDN微信小程序开发专栏, ...

  8. ASP.NET MVC 页面调整并传递参数

    转自:http://blog.csdn.net/zhensoft163/article/details/7174661 使用过ASP.NET MVC的人都知道在MVC中页面后台中常用的页面跳转方法有几 ...

  9. vue项目webpack中Npm传递参数配置不同域名接口

    项目开发中,前端在配置后端api域名时很困扰,常常出现:本地开发环境: api-dev.demo.com测试环境: api-test.demo.com线上生产环境: api.demo.com, 这次是 ...

随机推荐

  1. OFDM符号速率与子载波间隔的关系

    一般采样速率fs等于符号速率Rb: 采样速率表示采样的快慢,现有N个采样点: 类似于路程(N)除以速度(fs)等于时间(Tb): 采样一个点所需时间Tb = N/fs: 即一个子载波持续时间为Tb = ...

  2. SP4546 ANARC08A - Tobo or not Tobo IDA*

    题意:

  3. 【csp模拟赛5】购物(shopping.cpp)--常规

    多项式,因为每次的x相同,所以把a和b相加就行了,然后找对称轴,找离对称轴最近的整数点,然而我却写了个暴力,没看x #include <iostream> #include <cst ...

  4. 【csp模拟赛1】T1 心有灵犀

    [题目描述] 爱玩游戏的小 Z 最近又换了一个新的游戏.这个游戏有点特别,需要两位玩 家心有灵犀通力合作才能拿到高分. 游戏开始时,两位玩家会得到同一个数字 N,假设这个数字共有 t 位数码, 然后两 ...

  5. jQuery系列(十三):实现轮播

    1.轮播一: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UT ...

  6. 数据结构实验之链表三:链表的逆置(SDUT 2118)

    题目链接 #include <bits/stdc++.h> using namespace std; struct node { int data; struct node *next; ...

  7. C#实现代码生成器

    最近在用layui做后台管理,增删改查这些一成不变的东西写起来浪费大量时间,于是做了个简单的代码生成器快速生成 代码生成器的原理其实很简单,都是基于模板实现替换,Razor是个不错的选择(或者Nvel ...

  8. sql_monitor实时监控

    1 检查数据库是否启用了监控功能 1)检查参数:CONTROL_MANAGEMENT_PACK_ACCES SQL> show parameter CONTROL_MANAGEMENT_PACK ...

  9. Docker-----关于dockerfile

    docker build参数说明 --no-cache :创建镜像的过程不使用缓存: --force-rm :设置镜像过程中删除中间容器: --network=host:容器会使用宿主机的网络,容器与 ...

  10. 问题解决:fatal error C1083: 无法打开包括文件:No such file or directory

    fatal error C1083: 无法打开包括文件:No such file or directory将别的工程直接用VS2010打开出现了该问题,此时必须检查是不是: 1. 如果要引入的这些.h ...