微信小程序错误this.setData报错及解决过程


Posted in Javascript onSeptember 18, 2019

先说原因:

function声明的函数和箭头函数的作用域不同,这是一个不小心坑的地方。可参考箭头函数说明:

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions

所以对于这个结果,还是换回es5的function函数去写最好了。

箭头函数和function的区别:

  • 箭头函数体内的this对象,就是定义时所在的对象,而不是使用时所在的对象
  • 箭头函数不可以当作构造函数,也就是说,不可以使用new命令,否则会抛出一个错误
  • 箭头函数不可以使用arguments对象,该对象在函数体内不存在。如果要用,可以用Rest参数代替,不可以使用yield命令,因此箭头函数不能用作Generator函数。

这么写会报错

thirdScriptError
this.setData is not a function;at pages/index/index onLoad function;at api getSystemInfo success callback function
TypeError: this.setData is not a function
onLoad: function () {
  wx.getSystemInfo({
   success: function (res) {
    this.setData({
     lang: res.language
    })
    console.log(res.language)
   }
  })

这么改一下就不报错了。

onLoad: function() {
  wx.getSystemInfo({
    success: (res) = >{
      this.setData({箭头函数的this始终指向函数定义时的this lang: res.language
      }) console.log(res.language)
    }
  })

或者这样:

onLoad: function () {
  var that=this;
  wx.getSystemInfo({
   success: function (res) {
    that.setData({
     lang: res.language
    })
    console.log(res.language)
   }
  })

可以用如下示例说明:

'use strict';
var obj = {
 i: 10,
 b: () => console.log(this.i, this),
 c: function() {
  console.log(this.i, this);
 }
}
obj.b(); // prints undefined, Window {...} (or the global object)
obj.c(); // prints 10, Object {...}

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
7个Javascript地图脚本整理
Oct 20 Javascript
javascript 多浏览器 事件大全
Mar 23 Javascript
js利用数组length属性清空和截短数组的小例子
Jan 15 Javascript
js类定义函数时用prototype与不用的区别示例介绍
Jun 10 Javascript
JavaScript Serializer序列化时间处理示例
Jul 31 Javascript
基于Echarts 3.19 制作常用的图形(非静态)
May 19 Javascript
JS使用onerror捕获异常示例
Aug 03 Javascript
基于JavaScript实现Tab选项卡切换效果
Nov 24 Javascript
微信小程序 chooseImage选择图片或者拍照
Apr 07 Javascript
jQuery EasyUI window窗口使用实例代码
Dec 25 jQuery
解决ele ui 表格表头太长问题的实现
Nov 13 Javascript
Vue数组响应式操作及高阶函数使用代码详解
Aug 01 Javascript
解决layui富文本编辑器图片上传无法回显的问题
Sep 18 #Javascript
layui 富文本赋值,取值,取纯文本值的实例
Sep 18 #Javascript
layui 富文本编辑器和textarea值的相互传递方法
Sep 18 #Javascript
微信小程序获取地理位置及经纬度授权代码实例
Sep 18 #Javascript
layui复选框限制选择个数的方法
Sep 18 #Javascript
layui lay-verify form表单自定义验证规则详解
Sep 18 #Javascript
layui输入框只允许输入中文且判断长度的例子
Sep 18 #Javascript
You might like
图书管理程序(二)
2006/10/09 PHP
PHP 获取目录下的图片并随机显示的代码
2009/12/28 PHP
分享一段php获取linux服务器状态的代码
2014/05/27 PHP
php 函数使用可变数量的参数方法
2017/05/02 PHP
dojo 之基础篇(三)之向服务器发送数据
2007/03/24 Javascript
js取模(求余数)隔行变色
2014/05/15 Javascript
一个JavaScript函数把URL参数解析成Json对象
2014/09/24 Javascript
jQuery如何获取同一个类标签的所有值(默认无法获取)
2014/09/25 Javascript
返回顶部按钮响应滚动且动态显示与隐藏
2014/10/14 Javascript
详解AngularJS实现表单验证
2015/12/10 Javascript
JS实现身份证输入框的输入效果
2017/08/21 Javascript
ES6之模版字符串的具体使用
2018/05/17 Javascript
vue操作下拉选择器获取选择的数据的id方法
2018/08/24 Javascript
vue form 表单提交后刷新页面的方法
2018/09/04 Javascript
Node.js 使用request模块下载文件的实例
2018/09/05 Javascript
推荐几个不错的console调试技巧实现
2019/12/20 Javascript
javascript Canvas动态粒子连线
2020/01/01 Javascript
js实现简单放大镜效果
2020/03/07 Javascript
Element InputNumber计数器的使用方法
2020/07/27 Javascript
[01:29]Ti4循环赛第三日精彩回顾
2014/07/13 DOTA
Python动态加载模块的3种方法
2014/11/22 Python
Python字典及字典基本操作方法详解
2018/01/30 Python
html5自带表单验证体验优化及提示气泡修改功能
2017/09/12 HTML / CSS
深入剖析HTML5 内联框架iFrame
2016/05/04 HTML / CSS
深入了解canvas在移动端绘制模糊的问题解决
2019/04/30 HTML / CSS
雅萌 (YA-MAN) :日本美容家电领域的龙头企业
2017/05/12 全球购物
Notino希腊:购买香水和美容产品
2019/07/25 全球购物
澳大利亚著名的纺织品品牌:Canningvale
2020/05/05 全球购物
自我鉴定模板
2013/10/29 职场文书
最新教师自我评价分享
2013/11/12 职场文书
村干部承诺书
2014/03/28 职场文书
小学体育组工作总结2015
2015/07/21 职场文书
校长新学期致辞
2015/07/30 职场文书
2016年小学优秀班主任事迹材料
2016/02/29 职场文书
创业计划书之都市休闲农庄
2019/12/28 职场文书
彻底弄懂Python中的回调函数(callback)
2022/06/25 Python