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


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 相关文章推荐
javascript 鼠标滚轮事件
Apr 09 Javascript
JS实现点击按钮后框架内载入不同网页的方法
May 05 Javascript
webpack中引用jquery的简单实现
Jun 08 Javascript
JavaScript 控制字体大小设置的方法
Nov 23 Javascript
Angular1.x复杂指令实例详解
Mar 01 Javascript
vue2.0实现导航菜单切换效果
May 08 Javascript
JS利用正则表达式实现简单的密码强弱判断实例
Jun 16 Javascript
小程序自定义组件实现城市选择功能
Jul 18 Javascript
详解JavaScript中typeof与instanceof用法
Oct 24 Javascript
搭建基于express框架运行环境的方法步骤
Nov 15 Javascript
深入了解query和params的使用区别
Jun 24 Javascript
JavaScript基于SVG的图片切换效果实例代码
Dec 15 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
thinkphp实现附件上传功能
2017/05/26 PHP
javascript 验证日期的函数
2010/03/18 Javascript
基于JQuery实现CheckBox全选全不选
2011/06/27 Javascript
简单几行JS Code实现IE邮件转发新浪微博
2013/07/03 Javascript
JavaScript学习笔记之数组求和方法
2016/03/23 Javascript
简单封装js的dom查询实例代码
2016/07/08 Javascript
AngularJS深入探讨scope,继承结构,事件系统和生命周期
2016/11/02 Javascript
Bootstrap的modal拖动效果
2016/12/25 Javascript
Vue.directive自定义指令的使用详解
2017/03/10 Javascript
jQuery EasyUI 组件加上“清除”功能实例详解
2017/04/11 jQuery
Parcel 打包示例(React HelloWorld)
2018/01/16 Javascript
搭建一个nodejs脚手架的方法步骤
2019/06/28 NodeJs
更优雅的微信小程序骨架屏实现详解
2019/08/07 Javascript
vue $set 给数据赋值的实例
2019/11/09 Javascript
你知道JavaScript Symbol类型怎么用吗
2020/01/08 Javascript
vue实现在进行增删改操作后刷新页面
2020/08/05 Javascript
[02:36]DOTA2亚洲邀请赛小组赛精彩集锦:EE凭借法力虚空拿下4杀
2017/03/30 DOTA
Python利用matplotlib生成图片背景及图例透明的效果
2017/04/27 Python
Python实现购物车购物小程序
2018/04/18 Python
python 通过手机号识别出对应的微信性别(实例代码)
2019/12/22 Python
TensorFlow:将ckpt文件固化成pb文件教程
2020/02/11 Python
HTML5文档结构标签
2017/04/21 HTML / CSS
介绍一下Make? 为什么使用make
2016/07/31 面试题
建筑工程实习自我鉴定
2013/09/19 职场文书
小学家长会邀请函
2014/01/23 职场文书
元旦晚会感言
2014/03/12 职场文书
感恩寄语大全
2014/04/11 职场文书
国旗下演讲稿
2014/05/08 职场文书
学校春季防火方案
2014/06/08 职场文书
2014国庆黄金周超市促销活动方案
2014/09/21 职场文书
党的作风建设心得体会
2014/10/22 职场文书
品德与社会教学反思
2016/02/24 职场文书
pycharm代码删除恢复的方法
2021/06/26 Python
SQL写法--行行比较
2021/08/23 SQL Server
记一次Mysql不走日期字段索引的原因小结
2021/10/24 MySQL
react中useState使用:如何实现在当前表格直接更改数据
2022/08/05 Javascript