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


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 EasyUI的添加,修改,删除,查询等基本操作介绍
Oct 11 Javascript
Javascript编程中几种继承方式比较分析
Nov 28 Javascript
浅谈$('div a') 与$('div>a')的区别
Jul 18 Javascript
AngularJS入门教程之ng-checked 指令详解
Aug 01 Javascript
微信小程序 页面跳转传参详解
Oct 28 Javascript
解决Angular.Js与Django标签冲突的方案
Dec 20 Javascript
select下拉框插件jquery.editable-select详解
Jan 22 Javascript
JS实现复制功能
Mar 01 Javascript
JS实现新建文件夹功能
Jun 17 Javascript
JavaScript继承定义与用法实践分析
May 28 Javascript
Vue移动端用淘宝弹性布局lib-flexible插件做适配的方法
May 26 Javascript
vue实现点击出现操作弹出框的示例
Nov 05 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 字符过滤类,用于过滤各类用户输入的数据
2009/05/27 PHP
PHP把网页保存为word文件的三种方法
2014/04/01 PHP
javascript for循环设法提高性能
2010/02/24 Javascript
event.X和event.clientX的区别分析
2011/10/06 Javascript
javascript模拟地球旋转效果代码实例
2013/12/02 Javascript
js用闭包遍历树状数组的方法
2014/03/19 Javascript
jquery选择符快速提取web表单数据示例
2014/03/27 Javascript
JavaScript的null和undefined区别示例介绍
2014/09/15 Javascript
JavaScript函数详解
2014/11/17 Javascript
jquery动感漂浮导航菜单代码分享
2020/04/15 Javascript
jQuery+css实现炫目的动态块漂移效果
2016/01/28 Javascript
AngularJS directive返回对象属性详解
2016/03/28 Javascript
javascirpt实现2个iframe之间传值的方法
2016/06/30 Javascript
javascript self对象使用详解
2016/10/18 Javascript
使用Curl命令查看请求响应时间方法
2016/11/04 Javascript
JavaScript实现清空(重置)文件类型INPUT元素值的方法
2016/11/17 Javascript
简单快速的实现js计算器功能
2017/08/17 Javascript
js获取css的各种样式并且设置他们的方法
2017/08/22 Javascript
vue基于element的区间选择组件
2018/09/07 Javascript
原生JS封装拖动验证滑块的实现代码示例
2020/06/01 Javascript
vue 解决无法对未定义的值,空值或基元值设置反应属性报错问题
2020/07/31 Javascript
Node.js文本文件BOM头的去除方法
2020/11/22 Javascript
[04:29]2016国际邀请赛中国区预选赛Ehome战队教练采访
2016/06/27 DOTA
Tornado Web Server框架编写简易Python服务器
2018/07/28 Python
Python实现的简单计算器功能详解
2018/08/25 Python
Python中关键字global和nonlocal的区别详解
2018/09/03 Python
django如何实现视图重定向
2019/07/24 Python
Python实现异步IO的示例
2020/11/05 Python
HTML5 source标签:媒介元素定义媒介资源
2018/01/29 HTML / CSS
文职个人求职信范文
2013/09/23 职场文书
机电工程专业应届生求职信
2013/10/03 职场文书
初中考试作弊检讨书
2014/02/01 职场文书
助学贷款贫困证明
2014/09/23 职场文书
2015年小学开学寄语
2015/02/27 职场文书
离婚起诉书范文2016
2015/11/26 职场文书