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


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 相关文章推荐
动态创建script标签实现跨域资源访问的方法介绍
Feb 28 Javascript
jQuery判断数组是否包含了指定的元素
Mar 10 Javascript
javascript记住用户名和登录密码(两种方式)
Aug 04 Javascript
VUE元素的隐藏和显示(v-show指令)
Jun 23 Javascript
解决vue项目报错webpackJsonp is not defined问题
Mar 14 Javascript
VSCode中如何利用d.ts文件进行js智能提示
Apr 13 Javascript
深入理解Vue 组件之间传值
Aug 16 Javascript
jQuery常见的遍历DOM操作详解
Sep 05 jQuery
解决layer.prompt无效的问题
Sep 24 Javascript
vue中的mescroll搜索运用及各种填坑处理
Oct 30 Javascript
JavaScript检测是否开启了控制台(F12调试工具)
Oct 02 Javascript
vue-cli3.0修改打包后的文件名和文件地址,打包后本地运行报错解决
Apr 06 Vue.js
小程序封装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入门小知识
2008/03/24 PHP
用PHP读取RSS feed的代码
2008/08/01 PHP
Uncaught exception com_exception with message Failed to create COM object
2012/01/11 PHP
Yii不依赖Model的表单生成器用法实例
2014/12/04 PHP
thinkPHP多语言切换设置方法详解
2016/11/11 PHP
JavaScript toFixed() 方法
2010/04/15 Javascript
flexigrid 类似ext grid的JS表格代码
2010/07/17 Javascript
html+css+js实现xp window界面及有关功能
2013/03/26 Javascript
js特殊字符转义介绍
2013/11/05 Javascript
Ajax提交与传统表单提交的区别说明
2014/02/07 Javascript
chrome浏览器当表单自动填充时如何去除浏览器自动添加的默认样式
2015/10/09 Javascript
Javascript的表单与验证-非空验证
2016/03/18 Javascript
js调用webservice构造SOAP进行身份验证
2016/04/27 Javascript
基于Vue如何封装分页组件
2016/12/16 Javascript
微信小程序 开发之快递查询功能的实现
2017/01/09 Javascript
jQuery基于Ajax方式提交表单功能示例
2017/02/10 Javascript
js鼠标移动时禁止选中文字
2017/02/19 Javascript
jQuery插件FusionCharts绘制2D环饼图效果示例【附demo源码】
2017/04/10 jQuery
深入浅析Node环境和浏览器的区别
2018/08/14 Javascript
AngularJs返回前一页面时刷新一次前面页面的方法
2018/10/09 Javascript
详细介绍Ruby中的正则表达式
2015/04/10 Python
Python图像灰度变换及图像数组操作
2016/01/27 Python
Python中字典和集合学习小结
2017/07/07 Python
Python实现自定义读写分离代码实例
2019/11/16 Python
Python变量、数据类型、数据类型转换相关函数用法实例详解
2020/01/09 Python
使用python修改文件并立即写回到原始位置操作(inplace读写)
2020/06/28 Python
毕业生个人求职的自我评价
2013/10/28 职场文书
会计专业自我鉴定范文
2013/12/29 职场文书
创建卫生先进单位实施方案
2014/03/10 职场文书
医师定期考核实施方案
2014/05/07 职场文书
个人整改措施书面材料
2014/10/24 职场文书
党风廉正建设责任书
2015/01/29 职场文书
小学生运动会广播
2015/08/19 职场文书
2019年教师节活动策划方案
2019/09/09 职场文书
Mysql中调试存储过程最简单的方法
2021/06/30 MySQL
《巫师》是美食游戏?CDPR10月将推出《巫师》官方食谱
2022/04/03 其他游戏