vue从一个页面跳转到另一个页面并携带参数
1.需求:
点击商场跳转到商业体列表
解决方案:
元页面:
a标签中添加跳转函数
<a class="orderBtn1 sIRicon2" href="javascript:void(0);" @click="toMallInfo('M000989')"><i class="sIRicon"></i>商场</a>
toMallInfo: function(mallCode){
this.$router.push({
path: '/propertyInfo/mall/mallList',
// name: 'mallList',
query: {
mallCode: 'M000989'
}
})
},
将将跳转的url添加到 $router中。
path 中的url 最前面加 / 代表是根目录下,不加则是子路由
通过path + query 的组合传递参数
----
跳转页面接收参数
created(){
this.getParams()
},
methods :{getParams(){
// 取到路由带过来的参数
const routerParams = this.$route.query.mallCode
// 将数据放在当前组件的数据内
this.mallInfo.searchMap.mallCode = routerParams;
this.keyupMallName()
}
},
watch: {
'$route': 'getParams'
}
解决!!!
vue从一个页面跳转到另一个页面并携带参数的更多相关文章
- vue滚动行为控制——页面跳转返回上一个页面保留滚动位置
需求分析: 一般这个功能在后台管理系统用的比较多,因为后台页面都是在当前页面打开,对于某些列表筛选页,如果列表数据比较多,页面就会滚动.当页面发生滚动,对列表数据进行查看或者编辑的时候,跳转到下一级页 ...
- vue从一个组件跳转到另一个组件页面router-link的试用
需求从helloworld.vue页面跳到good.vue页面 1.helloworld.vue页面代码 <template> <div class="hello" ...
- vue实现登录后跳转到之前的页面
在开发中我们经常遇到这样的需求,需要用户直接点击一个链接进入到一个页面,用户点击后链接后会触发401拦截返回登录界面,登录后又跳转到链接的页面而不是首页,这种问题该如何去做呢? 先说一下我们需要用到的 ...
- 基于jquery的从一个页面跳转到另一个页面的指定位置的实现代码
比如 想跳到 mao.aspx 的页面 的div id="s" 的位置 那么 只用<a href="mao.aspx#s"> 就可实现跳转到指定位置 ...
- windowsphone开发页面跳转到另一个dll中的页面
WP的页面跳转一般是只能跳转到本DLL的页面, 如果要跳转到其他DLL的页面则需要这样写 (Application.Current.RootVisual as PhoneApplicationFram ...
- jsp中点击一个图片跳转到另一个页面的方法
1.这是jsp页面中的关于图片的那段代码 <img src="images/tj1.png " id="tj1"></img> 2.跳转 ...
- iframe框架下的某一页面跳转到另外一个页面
//iframe只在当前页跳转 window.location = "/Admin/Blog/Index"; 只在当前页跳转 而不是整个页面都跳转
- Jsp页面跳转和js控制页面跳转的几种方法
Jsp 页面跳转的几种方法 1. RequestDispatcher.forward() 在服务器端起作用,当使用forward()时,Servlet engine传递HTTP请求从当前的Servle ...
- 由一个activity跳转到另一个activity
定义一个按钮,当点击的时候跳转到另一个activity的界面 1.新建第二个activity 2.在第二个Java源码处继承第一个activity,导入 3.在source中复写Oncreat方法 4 ...
- 【原创】Android 从一个Activity跳转到另外一个Activity
Android四大组件activity使用,实现两个activity之间的跳转 基本流程:创建两个activity-将其中一个activity中组件作为事件源-通过组件事件的处理借助intent对象实 ...
随机推荐
- android解析xml文件的方式
android解析xml文件的方式 作者:东子哥 ,发布于2012-11-26,来源:博客园 在androd手机中处理xml数据时很常见的事情,通常在不同平台传输数据的时候,我们就可能使用xm ...
- 读书笔记 Week5 2018-4-5
再结束了第一个个人任务以后,我也算有点时间翻开一本大部头来通读一下.在看了一些相关的评论说:“该书可以从任意章节读起”后,刚刚在180M测试文件的个人任务中吃了亏的我,决定从他的第5部分,代码改善看起 ...
- Hadoop之MapReduce(一)简介及简单案例
简介 Hadoop MapReduce是一个分布式运算编程框架,基于该框架能够容易地编写应用程序,进而处理海量数据的计算. MapReduce是一种编程模型,用于大规模数据集(大于1TB)的并行运算. ...
- 用gdb+nm调试php c extension程序
.so写好了是给php脚本调用的,如果php脚本执行崩掉了,.so也只能在进程中饮恨而终,这时候php脚本调试经常用的echo, print_r, var_dump都派不上用场了.即使能打印一点儿错误 ...
- 利用Chrome的Performance工具排查页面性能问题(原叫timeline)
当页面中发生卡顿,最先考虑的是swf文件造成的卡顿,经过排查发现不是swf造成的影响,利用Chrome的Performance工具发现页面中的一些元素不断在重新布局,造成潜在的性能瓶颈. 首先在Chr ...
- Linux 搭建NFS文件服务器实现文件共享
我们接着玩Linux,O(∩_∩)O哈哈~ 1.什么是nfs NFS(Network File System)即网络文件系统,是FreeBSD支持的文件系统中的一种,它允许网络中的计算机之间通过TCP ...
- 2.8.3 并发下诡异的HashMap
package 第二章.并发下诡异的HashMap; import org.junit.Test; import java.util.HashMap;import java.util.Map;impo ...
- 编写高质量代码改善C#程序的157个建议——建议51:具有可释放字段的类型或拥有本机资源的类型应该是可释放的
建议51:具有可释放字段的类型或拥有本机资源的类型应该是可释放的 在建议50中,我们将C#中的类型分为:普通类型和继承了IDisposable接口的非普通类型.非普通类型除了包含那些托管资源的类型外, ...
- 转换汉子首字母类 CreatChinaSpell
public class CreatChinaSpell { public static string GetChineseFirstChar(string chineseStr) { StringB ...
- .NET架构转Java开发必须了解的历史
终于不在职守在.NET领域 .NET的winform和webform项目也开发了很多了 尤其是WEB领域 从ASP -> ASP.NET 2.0 -> ASP.NET MVC 4.0 - ...