微信小程序传值以及获取值方法的详解


Posted in Javascript onApril 29, 2019

微信小程序传值以及获取值方法,传值有两种方法,对应也有获取值得方法,

1、设置id的方法标识跳转后传递的参数值;

2、通过使用data - xxxx 的方法来标识要传递的值

微信小程序设置id的方法标识来传值

在要跳转的item处,设置一个id并给当前的id赋值上对应的key值,比如一部电影的id(后面带着id去下一个页面查询,详细信息)如:

微信小程序传值以及获取值方法的详解

后我们在js的bindtap的响应事件中获取,并传递到下一个界面中;

获取到id传的值

通过e.currentTarget.id;获取设置的id值,并通过设置全局对象的方式来传递数值,
获取全局对象 var app=getApp(); //设置全局的请求访问传递的参数 app.requestDetailid=id;

微信小程序传值以及获取值方法的详解

提示:其实我们也可以在,wxml中查看到我们设置的每一个item的id值

微信小程序传值以及获取值方法的详解

通过使用data - xxxx 的方法标识来传值

通过使用data - xxxx 的方法标识来传值,xxxx可以自定义取名 比如data-key等等都可以。

微信小程序传值以及获取值方法的详解微信小程序传值以及获取值方法的详解

如何获取data-xxxx传递的值?

在js的bindtap的响应事件中:

通过数据解析一层层找到数据,var id=e.target.dataset.id(根据你的data-id的取名)

微信小程序传值以及获取值方法的详解微信小程序传值以及获取值方法的详解

微信小程序如何跨页面获取值?

依据上面的方式设置要传递的值,页面跳转后,我们就需要在下一个页面拿到传递的数据(这个数据在传递前,就已经被设置成全局变量)

在跳转后的js页面,接收传递过来的数据detail.js

同样通过全局额方式取值出来,(即和app.js中取某个变量的值是一样的)

var movieid=getApp().MovieDetailid;
console.log(movieid);

微信小程序传值以及获取值方法的详解

到此为止,我们数值传递并接收成功,后面就可以根据我们接收的参数,进行进一步的操作了。

以上所述是小编给大家介绍的微信小程序传值以及获取值方法详解整合,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
JQuery读取XML文件数据并显示的实现代码
Dec 16 Javascript
JavaScript类型转换方法及需要注意的问题小结(挺全面)
Nov 11 Javascript
javascript搜索框点击文字消失失焦时文本出现
Sep 18 Javascript
纯jquery实现模仿淘宝购物车结算
Aug 20 Javascript
jquery实现弹出层登录和全屏层注册特效
Aug 28 Javascript
AngularJS 指令详细介绍
Jul 27 Javascript
JS日期对象简单操作(获取当前年份、星期、时间)
Oct 26 Javascript
angular动态表单制作
Feb 23 Javascript
Vue2.X 通过AJAX动态更新数据
Jul 17 Javascript
javascript实现blob加密视频源地址的方法
Aug 08 Javascript
ZK中使用JS读取客户端txt文件内容问题
Nov 07 Javascript
Openlayers显示地理位置坐标的方法
Sep 28 Javascript
小程序封装wx.request请求并创建接口管理文件的实现
Apr 29 #Javascript
详解JavaScript实现动态的轮播图效果
Apr 29 #Javascript
Node.js如何优雅的封装一个实用函数的npm包的方法
Apr 29 #Javascript
实现elementUI表单的全局验证的方法步骤
Apr 29 #Javascript
深入浅析Vue 中 ref 的使用
Apr 29 #Javascript
详解微信小程序实现跑马灯效果(附完整代码)
Apr 29 #Javascript
vue中利用simplemde实现markdown编辑器(增加图片上传功能)
Apr 29 #Javascript
You might like
PHP调用三种数据库的方法(2)
2006/10/09 PHP
杏林同学录(七)
2006/10/09 PHP
php 异常处理实现代码
2009/03/10 PHP
php使用异或实现的加密解密实例
2013/09/04 PHP
PHP中curl_setopt函数用法实例分析
2015/04/16 PHP
thinkphp5实现微信扫码支付
2019/12/23 PHP
自定义一个jquery插件[鼠标悬浮时候 出现说明label]
2011/06/27 Javascript
回车直接实现点击某按钮的效果即触发单击事件
2014/02/27 Javascript
Nodejs使用mysql模块之获得更新和删除影响的行数的方法
2014/03/18 NodeJs
Javascript学习笔记之函数篇(五) : 构造函数
2014/11/23 Javascript
jQuery on()方法使用技巧详解
2015/04/16 Javascript
jquery实现选中单选按钮下拉伸缩效果
2015/08/06 Javascript
JavaScript中使用sencha gridpanel 编辑单元格、改变单元格颜色
2015/11/26 Javascript
阿里巴巴技术文章分享 Javascript继承机制的实现
2016/01/14 Javascript
Bootstrap弹出框(modal)垂直居中的问题及解决方案详解
2016/06/12 Javascript
js无法获取到html标签的属性的解决方法
2016/07/26 Javascript
jsonp跨域请求实现示例
2017/03/13 Javascript
bootstrap select插件封装成Vue2.0组件
2017/04/17 Javascript
node.js(express)中使用Jcrop进行图片剪切上传功能
2017/04/21 Javascript
easyui简介_动力节点Java学院整理
2017/07/14 Javascript
webpack4 处理CSS的方法示例
2018/09/03 Javascript
微信小程序用户授权、位置授权及获取微信绑定手机号
2019/07/18 Javascript
Jquery实现获取子元素的方法分析
2019/08/24 jQuery
js生成1到100的随机数最简单的实现方法
2020/02/07 Javascript
在vue中使用防抖函数组件操作
2020/07/26 Javascript
js实现菜单跳转效果
2020/12/11 Javascript
[01:03:31]DOTA2上海特级锦标赛B组资格赛#1 Alliance VS Fnatic第二局
2016/02/26 DOTA
Python 中的参数传递、返回值、浅拷贝、深拷贝
2019/06/25 Python
PyCharm取消波浪线、下划线和中划线的实现
2020/03/03 Python
Python DES加密实现原理及实例解析
2020/07/17 Python
Python爬虫爬取糗事百科段子实例分享
2020/07/31 Python
AmazeUI 加载进度条的实现示例
2020/08/20 HTML / CSS
销售找工作求职信
2013/12/20 职场文书
检讨书范文300字
2015/01/28 职场文书
小学生光盘行动倡议书
2015/04/28 职场文书
z-index不起作用
2021/03/31 HTML / CSS