微信小程序实现页面跳转传递参数(实体,对象)


Posted in Javascript onAugust 12, 2019

首先我们有这么一种需求,就是我在一个列表中点击了某个item,跳转到详情界面,那么我就需要把item的实体数据从列表页面传递到详情页面,那么我们来看看微信小程序给我们提供的API:

微信小程序实现页面跳转传递参数(实体,对象)

这里大家可以清楚看到api中说到的如何传递参数,其实它这里指的参数仅仅是一些普通的数据类型,我们要传递的实体是object类型,那么我们需要先把实体转成string类型进行传递,在详情页面接受到在逆向转成实体,如下面这段示例:

//这里我们跳转详情界面
queryItemClick: function (e) {
  var that = this
  //拿到点击的index下标
  var index = e.currentTarget.dataset.index
  //将对象转为string
  var queryBean = JSON.stringify(that.data.queryList[index])
  wx.navigateTo({
   url: '../queryResult/queryResult?queryBean=' + queryBean,
  })
 }

这里我们用JSON.stringify()函数将实体转成string类型进行传递,那么我们在看看接收参数:

/***重点内容*
  * 生命周期函数--监听页面加载
  */
 onLoad: function (options) {
  var that=this
  var queryBean = JSON.parse(options.queryBean);
  that.setData({
   queryBean: queryBean
  })
  //console.log(that.data.queryBean)
 }

这里我们在生命周期函数onLoad中获取我们传递的实体转的字符串,然后用JSON.parse()转成实体,最后赋值给我们的全局变量。

如果我们想要传递Json对象 也可以通过这样的方式进行传递。

以上就是本文的全部内容,此文章为学习小程序记录,如果能帮到你当然更好,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
capacityFixed 基于jquery的类似于新浪微博新消息提示的定位框
May 24 Javascript
运算符&&的三个不同层次
Apr 07 Javascript
js调用AJAX时Get和post的乱码解决方法
Jun 04 Javascript
node.js中的fs.truncateSync方法使用说明
Dec 15 Javascript
Bootstrap每天必学之栅格系统(布局)
Nov 25 Javascript
微信小程序 参数传递实例代码
Mar 20 Javascript
浅谈Angular4实现热加载开发旅程
Sep 08 Javascript
详解Axios统一错误处理与后置
Sep 26 Javascript
在vue中更换字体,本地存储字体非引用在线字体库的方法
Sep 28 Javascript
js实现上下左右键盘控制div移动
Jan 16 Javascript
vue项目中使用rem,在入口文件添加内容操作
Nov 11 Javascript
ECharts transform数据转换和dataZoom在项目中使用
Dec 24 Javascript
微信小程序实现传递多个参数与事件处理
Aug 12 #Javascript
node命令行工具之实现项目工程自动初始化的标准流程
Aug 12 #Javascript
五分钟搞懂Vuex实用知识(小结)
Aug 12 #Javascript
no-vnc和node.js实现web远程桌面的完整步骤
Aug 11 #Javascript
Angular8基础应用之表单及其验证
Aug 11 #Javascript
浅谈javascript错误处理
Aug 11 #Javascript
axios异步提交表单数据的几种方法
Aug 11 #Javascript
You might like
PHP实现的MongoDB数据库操作类分享
2014/05/12 PHP
PHP 错误处理机制
2015/07/06 PHP
php实现简易聊天室应用代码
2015/09/23 PHP
PHP封装的字符串加密解密函数
2015/12/18 PHP
解决laravel 5.1报错:No supported encrypter found的办法
2017/06/07 PHP
判断控件是否已加载完成的代码
2010/02/24 Javascript
QUnit jQuery的TDD框架
2010/11/04 Javascript
11个用于提高排版水平的基于jquery的文字效果插件
2012/09/14 Javascript
基于jQuery中对数组进行操作的方法
2013/04/16 Javascript
拖动table标题实现改变td的大小(css+js代码)
2013/04/16 Javascript
jQuery实现DIV响应鼠标滑过由下向上展开效果示例【测试可用】
2018/04/26 jQuery
微信小程序框架wepy之动态控制类名
2018/09/14 Javascript
基于mpvue搭建微信小程序项目框架的教程详解
2019/04/10 Javascript
ES6之Proxy的get方法详解
2019/10/11 Javascript
JQuery表单元素取值赋值方法总结
2020/05/12 jQuery
[04:59]2018DOTA2亚洲邀请赛 4.7 Mineski夺冠时刻
2018/04/09 DOTA
python+mysql实现简单的web程序
2014/09/11 Python
python检查指定文件是否存在的方法
2015/07/06 Python
Python编程之字符串模板(Template)用法实例分析
2017/07/22 Python
Python学习之用pygal画世界地图实例
2017/12/07 Python
基于Django URL传参 FORM表单传数据 get post的用法实例
2018/05/28 Python
python中对数据进行各种排序的方法
2019/07/02 Python
Django 缓存配置Redis使用详解
2019/07/23 Python
Python Pandas 箱线图的实现
2019/07/23 Python
python语言线程标准库threading.local解读总结
2019/11/10 Python
django框架两个使用模板实例
2019/12/11 Python
python GUI库图形界面开发之PyQt5信号与槽的高级使用技巧装饰器信号与槽详细使用方法与实例
2020/03/06 Python
Python利用matplotlib绘制折线图的新手教程
2020/11/05 Python
CSS3实现线性渐变用法示例代码详解
2020/08/07 HTML / CSS
职业生涯规划书的格式
2013/12/29 职场文书
国贸专业大学生职业生涯规划范文
2014/01/10 职场文书
会计专业自我评价
2014/02/12 职场文书
2014年小学美术工作总结
2014/12/20 职场文书
格列佛游记读书笔记
2015/06/30 职场文书
HTML5简单实现添加背景音乐的几种方法
2021/05/12 HTML / CSS
详解Spring Security如何在权限中使用通配符
2022/06/28 Java/Android