微信小程序中this指向作用域问题this.setData is not a function报错
在微信小程序中我们一般通过以下方式来修改data中的数据
this.setData({
index1: e.detail.value
})
比如在函数里面修改数据
bindFaChange1: function (e) {
this.setData({
index1: e.detail.value
})
}
但是当我们通过wx.request请求网络数据成功后绑定数据时候报以下错误
this.setData is not a function
代码如下:
doCalc:function(){
wx.request({
url: url,
method:'POST',
header: {
'content-type': 'application/json' // 默认值
},
success: function (res) {
if (res.data.code == 0){
this.setData({
maxCount: res.data.maxCount
});
}
}
})
}
这是因为this作用域指向问题 ,success函数实际是一个闭包 , 无法直接通过this来setData
那么需要怎么修改呢?
我们通过将当前对象赋给一个新的对象
var _this = this;
然后使用_this 来setData就行了
完整代码
doCalc:function(){
var _this = this;
wx.request({
url: url,
method:'POST',
header: {
'content-type': 'application/json' // 默认值
},
success: function (res) {
if (res.data.code == 0){
_this.setData({
maxCount: res.data.maxCount
});
}
}
})
}
另外说一下 , 在es6中 , 使用箭头函数是不存在这个问题的
例如 :
setTimeout( () => {
console.log(this.type + ' says ' + say)
}, 1000)
当我们使用箭头函数时,函数体内的this对象,就是定义时所在的对象,而不是使用时所在的对象。
并不是因为箭头函数内部有绑定this的机制,实际原因是箭头函数根本没有自己的this,它的this是继承外面的,因此内部的this就是外层代码块的this。
作者:fozero
声明:原创文章,转载请注明出处,谢谢!http://www.cnblogs.com/fozero/p/7841488.html
标签:前端,微信小程序,ES6
微信小程序中this指向作用域问题this.setData is not a function报错的更多相关文章
- 记录laravelchina中的微信小程序教程的第四节的安装easy WeChat扩展的报错
composer require "overtrue/laravel-wechat:~5.0 PHP Fatal error: Allowed memory size of 16106127 ...
- 微信小程序中 this.setData is not a function报错
在微信小程序中我们一般通过以下方式来修改data中的数据: 比如获取小程序缓存: wx.getStorage({ key: 'is_screen', success: function (res) { ...
- 全栈开发工程师微信小程序-中(中)
全栈开发工程师微信小程序-中(中) 开放能力 open-data 用于展示微信开放的数据 type 开放数据类型 open-gid 当 type="groupName" 时生效, ...
- 微信小程序中的循环遍历问题
比如:如果在微信小程序中要遍历输出 0-9 的数,我们会使用for循环 ;i<;i++){ console.log(i); } 确实结果也是这样: 但是,如果我在循环时同时调用wx的api接口1 ...
- 微信小程序中target与currentTarget
target在事件流的目标阶段:currentTarget在事件流的捕获,目标及冒泡阶段.但事件流处于目标阶段,target与currentTarget指向一样, 而当处于捕获和冒泡阶段的时候,tar ...
- 微信小程序中如何使用setData修改数组或对象中的某一参数
本人也是刚开始接触微信小程序,在微信小程序中经常会遇到修改数组中某一项的值,比如array[0]或者是对象中object.item的值.这些值在微信小程序中都需要使用一个名为setData的方法,而这 ...
- 微信小程序中事件
微信小程序中事件 一.常见的事件有 类型 触发条件 最低版本 touchstart 手指触摸动作开始 touchmove 手指触摸后移动 touchcancel 手指触摸动作被打断,如来电提醒,弹窗 ...
- ES6中Class的用法及在微信小程序中的应用实例
1.ES6的基本用法 ES6 提供了更接近传统语言的写法,引入了 Class(类)这个概念,作为对象的模板.通过class关键字,可以定义类.基本上,ES6 的class可以看作只是一个语法糖,它的绝 ...
- 网页或微信小程序中使元素占满整个屏幕高度
在项目中经常要用到一个容器元素占满屏幕高度和宽度,然后再在这个容器元素里放置其他元素. 宽度很简单就是width:100% 但是高度呢,我们知道的是height:100%必须是在父元素的高度给定了的情 ...
随机推荐
- Chapter3_操作符_别名机制
Java中的别名机制实际体现的是对于“=”这一类赋值操作符的使用规则和内涵.“=”的实际内涵是指将右边的变量的值(对于基本数据类型而言)或者某一个对象的引用(对于某个具体对象而言)复制到左边的变量名所 ...
- Java8特性之Lambda、方法引用和Streams
这里涉及三个重要特性: Lambda 方法引用 Streams ① Lambda 最早了解Lambda是在C#中,而从Java8开始,Lambda也成为了新的特性,而这个新的特性的目的,就是为了消除单 ...
- s1 Linux 硬件基础
s1 Linux硬件基础 服务器特点 1.稳定 2.方便拆卸-模块化 运维职责:运行和维护服务器 1.数据不能丢---大片不能没 2.保证网站7*24小时运行--一直要运行 3.用户体验要好----打 ...
- Android开发之Activity
活动(Activity) 活动是最容易吸引用户的地方,它是一种可以包含用户界面的组件,主要用于和用户交互. FirstActivity 手动创建活动 新建一个project,不再选择empty act ...
- 在Word中插入Excel对象
using Word = NetOffice.WordApi; Word.Document doc = this._wordApplication.Documents.Add(@"C:\Us ...
- 关于wifi网络基本原理了解
对于esp32,其wifi功能还是十分强大的,为了能够良好的完成wifi的相关开发,这里需要计算机网络的结构体系进行大致的了解. 一.网络结构分层 对于计算机网络结构,大体上可以分为5层结构: 物理层 ...
- 深度搜索优先(全排列)//本内容来自《啊哈!算法》或者英文名《Aha!Algorithms》)
package Mypackage; import java.util.Scanner; public class 全排列{ static int a[]=new int[10]; static ...
- JDBC几种常见的数据库连接
JDBC的URL=协议名+子协议名+数据源名.a 协议名总是“jdbc”.b 子协议名由JDBC驱动程序的编写者决定.c 数据源名也可能包含用户与口令等信息:这些信息也可单独提供.几种常见的数据库连接 ...
- less的功能和介绍
在全新的css中,经过程序员们的开发和努力.又打造了全新的less样式表的全新界面,只需引入外部样式表即刻套用,加上了函数定义和取值.大大的降低了代码的书写量.也更加方便程序员的调用和修改!
- WebViewJavascriptBridge浅析
WebViewJavascriptBridge是一个Objective-C与JavaScript进行消息互通的三方库.通过WebViewJavascriptBridge,我们可以很方便的实现OC和Ja ...