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从一个页面跳转到另一个页面并携带参数的更多相关文章

  1. vue滚动行为控制——页面跳转返回上一个页面保留滚动位置

    需求分析: 一般这个功能在后台管理系统用的比较多,因为后台页面都是在当前页面打开,对于某些列表筛选页,如果列表数据比较多,页面就会滚动.当页面发生滚动,对列表数据进行查看或者编辑的时候,跳转到下一级页 ...

  2. vue从一个组件跳转到另一个组件页面router-link的试用

    需求从helloworld.vue页面跳到good.vue页面 1.helloworld.vue页面代码 <template> <div class="hello" ...

  3. vue实现登录后跳转到之前的页面

    在开发中我们经常遇到这样的需求,需要用户直接点击一个链接进入到一个页面,用户点击后链接后会触发401拦截返回登录界面,登录后又跳转到链接的页面而不是首页,这种问题该如何去做呢? 先说一下我们需要用到的 ...

  4. 基于jquery的从一个页面跳转到另一个页面的指定位置的实现代码

    比如 想跳到 mao.aspx 的页面 的div id="s" 的位置 那么 只用<a href="mao.aspx#s"> 就可实现跳转到指定位置 ...

  5. windowsphone开发页面跳转到另一个dll中的页面

    WP的页面跳转一般是只能跳转到本DLL的页面, 如果要跳转到其他DLL的页面则需要这样写 (Application.Current.RootVisual as PhoneApplicationFram ...

  6. jsp中点击一个图片跳转到另一个页面的方法

    1.这是jsp页面中的关于图片的那段代码 <img src="images/tj1.png " id="tj1"></img> 2.跳转 ...

  7. iframe框架下的某一页面跳转到另外一个页面

    //iframe只在当前页跳转 window.location = "/Admin/Blog/Index"; 只在当前页跳转 而不是整个页面都跳转

  8. Jsp页面跳转和js控制页面跳转的几种方法

    Jsp 页面跳转的几种方法 1. RequestDispatcher.forward() 在服务器端起作用,当使用forward()时,Servlet engine传递HTTP请求从当前的Servle ...

  9. 由一个activity跳转到另一个activity

    定义一个按钮,当点击的时候跳转到另一个activity的界面 1.新建第二个activity 2.在第二个Java源码处继承第一个activity,导入 3.在source中复写Oncreat方法 4 ...

  10. 【原创】Android 从一个Activity跳转到另外一个Activity

    Android四大组件activity使用,实现两个activity之间的跳转 基本流程:创建两个activity-将其中一个activity中组件作为事件源-通过组件事件的处理借助intent对象实 ...

随机推荐

  1. java Web jsp嵌入代码的三种方式

    1,表达式标签  <%= 2+3%> 唯一有显示功能的标签 作用: 计算表达式的返回值 将表达式的返回值显示到网页中. 注意: 表达式中不能有分号 2,普通脚本标签  <% %> ...

  2. 配置SecureCRT连接VirtualBox虚拟机中的Linux环境

    在实际的运维中我们常常使用SecuriteCRT来远程控制Linux服务器.下面将详细介绍windows 7下通过VirtualBox搭建linux开发环境,并最终通过SecurityCRT来远程访问 ...

  3. 一次shell中seq的处理

    一次shell中seq的处理 背景:用要shell 提取 文件中内容,文件名是用序列号如下生成,文件差不多有将近400多w个  如下:  www.ahlinux.com 原始脚本#! /bin/sh# ...

  4. GCC 常见参数配置

    博客转载自:https://www.cnblogs.com/zhangsir6/articles/2956798.html 简介gcc and g++现在是gnu中最主要和最流行的c & c+ ...

  5. CSS变量教程

    今年三月,微软宣布 Edge 浏览器将支持 CSS 变量. 这个重要的 CSS 新功能,所有主要浏览器已经都支持了.本文全面介绍如何使用它,你会发现原生 CSS 从此变得异常强大. 一.变量的声明 声 ...

  6. 3.Strings 字符串如何工作?----对缓冲区的理解。

    修改Hello World程序向特定的人问好. #include <iostream> #include <string> int main() { std::string n ...

  7. 数据结构 Merge合并排序

    using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.T ...

  8. MongoDB整理笔记の索引

    MongoDB 提供了多样性的索引支持,索引信息被保存在system.indexes 中,且默认总是为_id创建索引,它的索引使用基本和MySQL 等关系型数据库一样.其实可以这样说说,索引是凌驾于数 ...

  9. 策略(Strategy)模式

    /* * 环境(Context)角色:持有一个Strategy类的引用. * 抽象策略(Strategy)角色:这是一个抽象角色,通常由一个接口或抽象类实现.此角色给出所有的具体策略类所需的接口. * ...

  10. 装饰(Decorator)模式

    一. 装饰(Decorator)模式 装饰(Decorator)模式又名包装(Wrapper)模式[GOF95].装饰模式以对客户端透明的方式扩展对象的功能,是继承关系的一个替代方案. 二. 装饰模式 ...