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

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

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

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

1
2
3
4
5
6
success: res =>{
  this.setData({
      loadingHidden: true,
      hideCommitSuccessToast: false
  })
}

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

再给一个完整的例子:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
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);
 
  }
 }

微信小程序 this和that详解及简单实例的更多相关文章

  1. 微信小程序获取用户手机号详解

    最近在做一款微信小程序,需要获取用户手机号,具体步骤如下: 流程图: 1.首先,客户端调用wx.login,回调数据了包含jscode,用于获取openid(用户唯一标识)和sessionkey(会话 ...

  2. 【微信小程序】支付过程详解

    一.介绍 今天跟大家分享微信小程序集成支付. 二.分析 1.小程序支付API 地址:https://mp.weixin.qq.com/debug/wxadoc/dev/api/api-pay.html ...

  3. 微信小程序--问题汇总及详解之form表单

    附上微信小程序开发文档链接:https://mp.weixin.qq.com/debug/wxadoc/dev/framework/MINA.html form表单: 当点击 <form/> ...

  4. 微信小程序支付之代码详解

    微信小程序自带的一套规则,类似vue语法,但是好多功能都集成在api中,给了很多初学者轮子,所以首先要熟悉这些api,忘记可照官网继续开发 这里主要说下微信小程序的支付,原理类似上篇介绍的公众网页支付 ...

  5. 微信小程序项目wx-store代码详解

    这篇文章会很长,非常长,特别长,无敌长. 真的是挤牙膏般的项目进度,差不多是8月底有开始这个项目的想法,时至今日都1个多月了,抛去频繁的加班时间,王者时间,羽毛球时间...见缝插针的写这个项目,我竟然 ...

  6. 微信小程序flex容器属性详解

    flex容器属性详解 flex-direction决定元素的排列方向 flex-wrap决定元素如何换行 flex-flow 是 flex-direction 和flex-wrap的简写 justif ...

  7. 微信小程序--问题汇总及详解之图片上传和地图

    地图用的是百度的地图,链接:http://lbsyun.baidu.com/index.php?title=wxjsapi/guide/getlocation 获取日期时间可以用小程序里自带的js文件 ...

  8. 微信小程序~生命周期方法详解

    生命周期是指一个小程序从创建到销毁的一系列过程 在小程序中 ,通过App()来注册一个小程序 ,通过Page()来注册一个页面 先来看一张小程序项目结构 从上图可以看出,根目录下面有包含了app.js ...

  9. 微信小程序setData()方法的详解以及对数组/json操作

    此篇文章是本人对setData方法的一些理解,是查阅文档和查找一些其他资料综述的,有所不足希望指正! 直接进入正题! 一.setData()方法: 1.参数接受一个对象,以key,value的形式表示 ...

随机推荐

  1. SpringSecurity如何退出登录

    ⒈如何退出登录? SpringSecurity默认为我们提供了退出操作,我们只需要访问特定的url就可以退出登录了 <!DOCTYPE html> <html lang=" ...

  2. CentOS6源码安装VSFTPD3

    还是碰到老问题:安全扫描,由于CentOS6上VSFTPD最高支持到V2.2.2,目前已经是官方支持的最新版本(发布了几年...) 但有安全漏洞,又没法通过限制访问进行控制,只能想办法升级到最新版本了 ...

  3. 新版本微信导致的ios表单bug

    解决方法如下: $(document).delegate('input, textarea, select', 'blur', function(){ setTimeout(function(){ $ ...

  4. 提高Django高并发性的部署方案(Python)

    方案: nginx + uWSGI 提高 Django的并发性        1. uWSGI :                 uWSGI是一个web服务器,实现了WSGI协议.uwsgi协议.h ...

  5. 题解-POI2007 OSI-Axes of Symmetry

    Problem bzoj1100 题意概要:给定一个简单多边形(不一定凸),求其对称轴数量 数据组数\(\leq 10\),多边形点数\(\leq 10^5\) Solution 这题算是跨界算法的经 ...

  6. 题解-hdu2866 Special Prime

    Problem hdu-2866 题意:求区间\([2,L]\)有多少素数\(p\)满足\(n^3+pn^2=m^3\),其中\(n,m\)属于任意整数 Solution 原式等价于\(n^2(p+n ...

  7. Centos 6.x/7.x yum安装php5.6.X(最新版)

    鉴于Centos 默认yum源的php版本太低了,手动编译安装又有点一些麻烦,那么如何采用Yum安装的方案安装最新版呢.那么,今天我们就来学习下如何用yum安装php最新版. 1.检查当前安装的PHP ...

  8. UPS不间断电源工作原理简述

    原文地址:https://blog.csdn.net/uamix/article/details/52776297 一.定义 UPS即不间断电源,是将蓄电池(多为铅酸免维护蓄电池)与主机相连接,通过主 ...

  9. hdu 4825 && acdream 1063 01字典树异或问题

    题意: 给一个集合,多次询问,每次给一个k,问你集合和k异或结果最大的哪个 题解: 经典的01字典树问题,学习一哈. 把一个数字看成32位的01串,然后查找异或的时候不断的沿着^为1的路向下走即可 # ...

  10. OpenCV中RGB和HSV转换的问题

    1.一般情况下HSV模型各分量的取值范围为:H为0到360°,S为0到100%,V为0到255.但是在OpenCV中在由RGB转换到HSV的过程中,发现HSV中H为0到180°,S为0到255,V为0 ...