vue从一个页面跳转到另一个页面并携带参数的解决方法


Posted in Javascript onAugust 12, 2019

1.需求:

vue从一个页面跳转到另一个页面并携带参数的解决方法

点击商场跳转到商业体列表

vue从一个页面跳转到另一个页面并携带参数的解决方法

解决方案:

元页面:

a标签中添加跳转函数

<a class="orderBtn1 sIRicon2" href="javascript:void(0);" rel="external nofollow" @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'
  }

解决!!!

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
层序遍历在ExtJs的TreePanel中的应用
Oct 16 Javascript
TimergliderJS 一个基于jQuery的时间轴插件
Dec 07 Javascript
js中opener与parent的区别详细解析
Jan 14 Javascript
jquery复选框多选赋值给文本框的方法
Jan 27 Javascript
javascript手工制作悬浮菜单
Feb 12 Javascript
js淡入淡出焦点图幻灯片效果代码分享
Sep 08 Javascript
jQuery实现无限往下滚动效果代码
Apr 16 Javascript
babel基本使用详解
Feb 17 Javascript
JavaScript闭包和回调详解
Aug 09 Javascript
vue中如何去掉空格的方法实现
Nov 09 Javascript
利用原生JavaScript实现造日历轮子实例代码
May 08 Javascript
详解jenkins自动化部署vue
May 14 Javascript
解析原来浏览器原生支持JS Base64编码解码
Aug 12 #Javascript
在vue-cli 3中给stylus、sass样式传入共享的全局变量
Aug 12 #Javascript
微信小程序实现页面跳转传递参数(实体,对象)
Aug 12 #Javascript
微信小程序实现传递多个参数与事件处理
Aug 12 #Javascript
node命令行工具之实现项目工程自动初始化的标准流程
Aug 12 #Javascript
五分钟搞懂Vuex实用知识(小结)
Aug 12 #Javascript
no-vnc和node.js实现web远程桌面的完整步骤
Aug 11 #Javascript
You might like
漂亮但不安全的CTB
2006/10/09 PHP
帝国CMS留言板回复后发送EMAIL通知客户
2015/07/06 PHP
详谈PHP面向对象中常用的关键字和魔术方法
2017/02/04 PHP
Yii2使用表单上传文件的实例代码
2017/08/03 PHP
PHP创建XML的方法示例【基于DOMDocument类及SimpleXMLElement类】
2019/09/10 PHP
php实现统计IP数及在线人数的示例代码
2020/07/22 PHP
根据地区不同显示时间的javascript代码
2007/08/13 Javascript
JScript 脚本实现文件下载 一般用于下载木马
2009/10/29 Javascript
JQuery获取元素文档大小、偏移和位置和滚动条位置的方法集合
2010/01/12 Javascript
js 数组的for循环到底应该怎么写?
2010/05/31 Javascript
jQuery代码优化之基本事件
2011/11/01 Javascript
基于jquery的文字向上跑动类似跑马灯的效果
2014/09/22 Javascript
javascript的BOM汇总
2015/07/16 Javascript
JS函数的几种定义方式分析
2015/12/17 Javascript
Vue中this.$router.push参数获取方法
2018/02/27 Javascript
浅谈Javascript常用正则表达式应用
2019/03/08 Javascript
layui实现鼠标移动到单元格上显示数据的方法
2019/09/11 Javascript
python备份文件的脚本
2008/08/11 Python
python并发编程之线程实例解析
2017/12/27 Python
pandas实现选取特定索引的行
2018/04/20 Python
Pycharm导入Python包,模块的图文教程
2018/06/13 Python
使用pycharm设置控制台不换行的操作方法
2019/01/19 Python
python gdal安装与简单使用
2019/08/01 Python
Python中函数的返回值示例浅析
2019/08/28 Python
python通过SSH登陆linux并操作的实现
2019/10/10 Python
python基于opencv检测程序运行效率
2019/12/28 Python
基于python实现对文件进行切分行
2020/04/26 Python
阿迪达斯丹麦官网:adidas丹麦
2016/10/01 全球购物
eDreams澳大利亚:预订机票、酒店和度假产品
2017/04/19 全球购物
MYSQL基础面试题
2012/05/13 面试题
公务员综合考察材料
2014/02/01 职场文书
高中生家长寄语大全
2014/04/03 职场文书
我的梦想演讲稿
2014/04/30 职场文书
教研处工作方案
2014/05/26 职场文书
合同意向书范本
2014/07/30 职场文书
党性观念心得体会
2014/09/03 职场文书