微信小程序错误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 相关文章推荐
10个新的最有前途的JavaScript框架
Mar 12 Javascript
JavaScript的eval JSON object问题
Nov 15 Javascript
JS实现程序暂停与继续功能代码解读
Oct 10 Javascript
js修改input的type属性问题探讨
Oct 12 Javascript
JQuery操作textarea,input,select,checkbox方法
Sep 02 Javascript
JavaScript实现点击单元格改变背景色的方法
Feb 12 Javascript
D3.js中强制异步文件读取同步的几种方法
Feb 06 Javascript
zTree节点文字过多的处理方法
Nov 24 Javascript
vux uploader 图片上传组件的安装使用方法
May 15 Javascript
解决vue-quill-editor上传内容由于图片是base64的导致字符太长的问题
Aug 20 Javascript
webpack中如何加载静态文件的方法步骤
May 18 Javascript
vue实现广告栏上下滚动效果
Nov 26 Vue.js
解决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/11/16 PHP
php解析http获取的json字符串变量总是空白null
2015/03/02 PHP
PHP操作XML中XPath的应用示例
2019/07/04 PHP
基于jQuery实现的百度导航li拖放排列效果,即时更新数据库
2012/07/31 Javascript
JS判断两个时间大小的示例代码
2014/01/28 Javascript
让JavaScript的Alert弹出框失效的方法禁止弹出警告框
2014/09/03 Javascript
详解javascript实现自定义事件
2016/01/19 Javascript
jQuery绑定自定义事件的魔法升级版
2016/06/30 Javascript
JavaScript面试开发常用的知识点总结
2016/08/08 Javascript
Vue实现PopupWindow组件详解
2018/04/28 Javascript
解决Vue axios post请求,后台获取不到数据的问题方法
2018/08/11 Javascript
Vue中的methods、watch、computed的区别
2018/11/26 Javascript
微信小程序-API接口安全详解
2019/07/16 Javascript
Vue实现穿梭框效果
2020/09/30 Javascript
python strip()函数 介绍
2013/05/24 Python
几个适合python初学者的简单小程序,看完受益匪浅!(推荐)
2019/04/16 Python
python+opencv像素的加减和加权操作的实现
2019/07/14 Python
Django 开发环境与生产环境的区分详解
2019/07/26 Python
centos+nginx+uwsgi+Django实现IP+port访问服务器
2019/11/15 Python
Python字节单位转换实例
2019/12/05 Python
Python3 元组tuple入门基础
2020/02/09 Python
pytorch torchvision.ImageFolder的用法介绍
2020/02/20 Python
使用python的turtle函数绘制一个滑稽表情
2020/02/28 Python
Python3.9又更新了:dict内置新功能
2020/02/28 Python
如何写python的配置文件
2020/06/07 Python
Notino法国:购买香水和化妆品
2019/04/15 全球购物
介绍一下.net和Java的特点和区别
2012/09/26 面试题
护士自我鉴定总结
2014/03/24 职场文书
大学生社会实践自我鉴定
2014/03/24 职场文书
银行金融服务方案
2014/06/11 职场文书
高中生第一学年自我鉴定2015
2014/09/28 职场文书
2014年高一班主任工作总结
2014/12/05 职场文书
冬季作息时间调整通知
2015/04/24 职场文书
2016中考冲刺决心书
2015/09/22 职场文书
2015教师个人年度工作总结
2015/10/23 职场文书
2016领导干部廉洁自律心得体会
2016/01/13 职场文书