微信小程序 this和that详解及简单实例


Posted in Javascript onFebruary 13, 2017

微信小程序中,在wx.request({});方法调用成功或者失败之后,有时候会需要获取页面初始化数据data的情况,这个时候,如果使用,this.data来获取,会出现获取不到的情况,调试页面也会报undefiend。原因是,在javascript中,this代表着当前对象,会随着程序的执行过程中的上下文改变,在wx.request({});方法的回调函数中,对象已经发生改变,所以已经不是wx.request({});方法对象了,data属性也不存在了。官方的解决办法是,复制一份当前的对象,如下:

var that=this;//把this对象复制到临时变量that

在success回调函数中使用that.data就能获取到数据了。

不过,还有另外一种方式,也很特别,是将success回调函数换一种声明方式,如下:

success: res =>{
  this.setData({
      loadingHidden: true,
      hideCommitSuccessToast: false
  })
}

在这种方式下,this可以直接使用,完全可以获取到data数据。

再给一个完整的例子:

success: res => {
    if (res.data.code != 0) {
     // 提交失败
     this.setData({
      loadingHidden: true,
      hiddenTips: false,
      tipsContent: res.data.message
     })
    } else {
     // 提交成功
     this.setData({
      loadingHidden: true,
      hideCommitSuccessToast: false
     })
     subBtn = false;

     // 定时,3秒消失
     setTimeout(() => {
      this.setData({
       hideCommitSuccessToast: true
      })
      wx.navigateBack({ delta: 2 });
     }, 2000);

    }
   }

感谢阅读,希望能帮助到大家,谢谢大家对本站的支持!

Javascript 相关文章推荐
jquery 图片Silhouette Fadeins渐显效果
Feb 07 Javascript
让人蛋疼的JavaScript语法特性
Sep 30 Javascript
JQuery的ON()方法支持的所有事件罗列
Feb 28 Javascript
javascript中Function类型详解
Apr 28 Javascript
js实现input框文字动态变换显示效果
Aug 19 Javascript
Jquery uploadify上传插件使用详解
Jan 13 Javascript
jQuery插件制作的实例教程
May 16 Javascript
AngularJs  Understanding Angular Templates
Sep 02 Javascript
浅谈jQuery中的$.extend方法来扩展JSON对象
Feb 12 Javascript
jQuery实现手势解锁密码特效
Aug 14 jQuery
javascript动态创建对象的属性详解
Nov 07 Javascript
微信小程序开发常见问题及解决方案
Jul 11 Javascript
脚本div实现拖放功能(两种)
Feb 13 #Javascript
bootstrap table 数据表格行内修改的实现代码
Feb 13 #Javascript
判断横屏竖屏(三种)
Feb 13 #Javascript
详解javascript立即执行函数表达式IIFE
Feb 13 #Javascript
jQuery实现大图轮播
Feb 13 #Javascript
使用ionic在首页新闻中应用到的跑马灯效果的实现方法
Feb 13 #Javascript
你真的了解BOM中的history对象吗
Feb 13 #Javascript
You might like
PHP 判断常量,变量和函数是否存在
2009/04/26 PHP
PHP XML备份Mysql数据库
2009/05/27 PHP
php后台多用户权限组思路与实现程序代码分享
2012/02/13 PHP
PHP网页游戏学习之Xnova(ogame)源码解读(十三)
2014/06/26 PHP
PHP实现linux命令tail -f
2016/02/22 PHP
使用php实现网站验证码功能【推荐】
2017/02/09 PHP
php实现的统计字数函数定义与使用示例
2017/07/26 PHP
PHP实现对图片的反色处理功能【测试可用】
2018/02/01 PHP
php + ajax 实现的写入数据库操作简单示例
2020/05/16 PHP
js设置cookie过期当前时间减去一秒相当于立即过期
2014/09/04 Javascript
Javascript基础教程之数据类型转换
2015/01/18 Javascript
node.js读取文件到字符串的方法
2015/06/29 Javascript
Bootstrap每天必学之缩略图与警示窗
2015/11/29 Javascript
AngularJS改变元素显示状态
2017/04/20 Javascript
移动端手指放大缩小插件与js源码
2017/05/22 Javascript
Angular2+国际化方案(ngx-translate)的示例代码
2017/08/23 Javascript
基于bootstrop常用类总结(推荐)
2017/09/11 Javascript
深入理解ES6中let和闭包
2018/02/22 Javascript
vue2.0+vue-dplayer实现hls播放的示例
2018/03/02 Javascript
JS实现为动态创建的元素添加事件操作示例
2018/03/17 Javascript
nodejs基础之buffer缓冲区用法分析
2018/12/26 NodeJs
基于javascript canvas实现五子棋游戏
2020/07/08 Javascript
浅谈编码,解码,乱码的问题
2016/12/30 Python
Python数据分析之双色球基于线性回归算法预测下期中奖结果示例
2018/02/08 Python
解决python文件双击运行秒退的问题
2019/06/24 Python
python实现鸢尾花三种聚类算法(K-means,AGNES,DBScan)
2019/06/27 Python
如何基于python操作excel并获取内容
2019/12/24 Python
印度在线杂货店:bigbasket
2018/08/23 全球购物
开会迟到检讨书
2014/01/08 职场文书
经济管理毕业生求职信
2014/03/15 职场文书
区域经理岗位职责
2015/02/02 职场文书
2015年度房地产工作总结
2015/04/09 职场文书
2015年小学生国庆节演讲稿
2015/07/30 职场文书
《好妈妈胜过好老师》:每个孩子的优秀都是有源头的
2020/01/03 职场文书
python 进阶学习之python装饰器小结
2021/09/04 Python
Python闭包的定义和使用方法
2022/04/11 Python