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. 【转载】从头到尾彻底理解KMP

    转自:http://blog.csdn.net/v_july_v/article/details/7041827 从头到尾彻底理解KMP 作者:July 时间:最初写于2011年12月,2014年7月 ...

  2. python struct的使用例子

    import struct i = 1024 # s0为一个字符串,长度为4,即占四个字节,这样方便传输与保存二进制数据. s0 = struct.pack(">I", i) ...

  3. group by用法提示:select涉及字段规则

    工资表t_salary如下:  id month  name  salary  1 201601  Jim  12  2 201601  Bruce  30  3 201601  Peter  23 ...

  4. docker-compose部署微服务

    1.安装docker-compose curl -L https://github.com/docker/compose/releases/download/1.23.2/docker-compose ...

  5. Python 串口通讯

    摘要: pyserial module: https://github.com/tbusf/pyserial Python使用pyserial进行串口通信:http://blog.csdn.net/l ...

  6. 解决“mysql不是内部/外部命令,也不是可执行程序,也不是批处理文件”

    解决方案: 1.切换到mysql.exe文件所在目录: 2.将mysql.exe文件所在目录添加到操作系统内的环境变量中: 如何添加环境变量: 1.右击“我的电脑”——>属性——>高级—— ...

  7. LC 756. Pyramid Transition Matrix

    We are stacking blocks to form a pyramid. Each block has a color which is a one letter string, like ...

  8. 把文档中的数据取出并插入到excel中

    from xlrd import open_workbookfrom xlutils.copy import copy jsonfile=r'C:\Users\Administrator\Deskto ...

  9. 在CentOS7阿里云服务器部署ThinkPHP5,并配置phpstrom实现同步开发(微信小程序及管理员后端)

    小程序和后端同步开发 1.服务器安装tp5框架: 方法很多比如:github.linux命令直接手动下.composer 都可以,方法很多,百度一下,不再累述 2.这时你会发现怎么都访问出现不了这个令 ...

  10. WebLogic服务器

    WebLogic是美国Oracle公司出品的一个application server确切的说是一个基于JAVAEE架构的中间件,BEA WebLogic是用于开发.集成.部署和管理大型分布式Web应用 ...