微信小程序错误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 相关文章推荐
jQuery toggleClass应用实例(附效果图)
Apr 06 Javascript
JavaScript打印网页指定区域的例子
May 03 Javascript
JS运动基础框架实例分析
Mar 03 Javascript
JS动态修改iframe内嵌网页地址的方法
Apr 01 Javascript
深入讲解xhr(XMLHttpRequest)/jsonp请求之abort
Jul 26 Javascript
javaScript日期工具类DateUtils详解
Dec 08 Javascript
Vue 使用中的小技巧
Apr 26 Javascript
echarts整合多个类似option的方法实例
Jul 10 Javascript
jQuery移动端跑马灯抽奖特效升级版(抽奖概率固定)实现方法
Jan 18 jQuery
VUE解决微信签名及SPA微信invalid signature问题(完美处理)
Mar 29 Javascript
Webpack中loader打包各种文件的方法实例
Sep 03 Javascript
vue 解决IOS10低版本白屏的问题
Nov 17 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
PHP中GET变量的使用
2006/10/09 PHP
PHP5 的对象赋值机制介绍
2011/08/02 PHP
PHP中copy on write写时复制机制介绍
2014/05/13 PHP
PHP针对JSON操作实例分析
2015/01/12 PHP
php简单实现短网址(短链)还原的方法(测试可用)
2016/05/09 PHP
Zend Framework数据库操作技巧总结
2017/02/18 PHP
解决Extjs上传图片无法预览的解决方法
2012/03/22 Javascript
javascript 实现字符串反转的三种方法
2013/11/23 Javascript
javascript 中__proto__和prototype详解
2014/11/25 Javascript
Node.js的Web模板引擎ejs的入门使用教程
2016/06/06 Javascript
jQuery实现的简单百分比进度条效果示例
2016/08/01 Javascript
初识简单却不失优雅的Vue.js
2016/09/12 Javascript
浅谈js在html中的加载执行顺序,多个jquery ready执行顺序
2016/11/26 Javascript
基于js实现二级下拉联动
2016/12/17 Javascript
jQuery Ajax实现跨域请求
2017/01/21 Javascript
微信小程序 ES6Promise.all批量上传文件实现代码
2017/04/14 Javascript
bootstrap+jQuery 实现下拉菜单中复选框全选和全不选效果
2017/06/12 jQuery
nodejs操作mongodb的增删改查功能实例
2017/11/09 NodeJs
在 Linux/Unix 中不重启 Vim 而重新加载 .vimrc 文件的流程
2018/03/21 Javascript
vue中实现图片压缩 file文件的方法
2020/05/28 Javascript
python查找目录下指定扩展名的文件实例
2015/04/01 Python
Python多线程编程简单介绍
2015/04/13 Python
Python浅拷贝与深拷贝用法实例
2015/05/09 Python
Python OpenCV读取png图像转成jpg图像存储的方法
2018/10/28 Python
使用Python-OpenCV向图片添加噪声的实现(高斯噪声、椒盐噪声)
2019/05/28 Python
python求质数列表的例子
2019/11/24 Python
HTML5实践-图片设置成灰度图
2012/11/12 HTML / CSS
JSF如何进行表格处理及取值
2012/08/06 面试题
一份软件工程师的面试试题
2016/02/01 面试题
投标邀请书范文
2014/01/31 职场文书
三万活动总结
2014/04/28 职场文书
财政专业大学生职业生涯规划书
2014/09/17 职场文书
2015年大学辅导员工作总结
2015/05/12 职场文书
教务处干事工作总结
2015/08/14 职场文书
2019年干货:自我鉴定
2019/03/25 职场文书
数据库的高级查询六:表连接查询:外连接(左外连接,右外连接,UNION关键字,连接中ON与WHERE的不同)
2021/04/05 MySQL