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. CSRF(跨站请求伪造)

    跨站请求伪造(Cross-site request forgery)是一种冒充受信任用户,向服务器发送非预期请求的攻击方式. 攻击的前提是: 用户已经登录过某网站. 攻击者通过一些诱惑性的标题,诱惑用 ...

  2. 关于JPA动态SQL查询

    1.继承接口 2.下面是简单的操作---自己写过的,下次再整理一下 public Page<IdddsMember> list(MemberSearch search, Pageable ...

  3. 小米 oj 硬币比赛(思维+动态规划)

     硬币比赛 序号:#47难度:困难时间限制:1000ms内存限制:10M 描述 有 n 个不同价值的硬币排成一条线.有 A 与 B 两个玩家,指定由 A 开始轮流(A 先手,然后 B,然后再 A..) ...

  4. 逆向bfs搜索打表+康拓判重

    HDU 1043八数码问题 八数码,就是1~8加上一个空格的九宫格,这道题以及这个游戏的目标就是把九宫格还原到从左到右从上到下是1~8然后最后是空格. 没了解康托展开之前,这道题怎么想都觉得很棘手,直 ...

  5. 「BZOJ 2653」middle「主席树」「二分」

    题意 一个长度为\(n\)的序列\(a\),设其排过序之后为\(b\),其中位数定义为\(b[n/2]\),其中\(a,b\)从\(0\)开始标号,除法取下整.给你一个长度为\(n\)的序列\(s\) ...

  6. 前端vue的get和post请求

    vue的get和post需要两个文件vue.js和vue-resource.js 以下是实现的代码,可以参考一下,需要注意的接口的请求需要考虑跨域的问题,其次就是访问页面需要在tomcat下访问,否则 ...

  7. 利用ceph-deploy部署ceph存储集群

    一.环境准备 创建两台主机,ip地址和主机名如下 192.168.2.100,主机名ceph-1 192.168.2.101,主机名ceph-2 每个主机 新增加一块数据盘,分区根据自己需要分区即可, ...

  8. linux下通过进程名查看其占用端口

    linux下通过进程名查看其占用端口: 1.先查看进程pid ps -ef | grep 进程名 2.通过pid查看占用端口 netstat -nap | grep 进程pid 例:通过nginx进程 ...

  9. LeetCode 简化路径(探索字节跳动)

    题目描述 给定一个文档 (Unix-style) 的完全路径,请进行路径简化. 例如, path = "/home/", => "/home" path ...

  10. react-hook设定定时器的方法

    const useInterval = (callback, delay) => { const savedCallback = useRef(); // 保存新回调 useEffect(() ...