微信小程序错误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 相关文章推荐
通过javascript把图片转化为字符画
Oct 24 Javascript
jquery实现类似淘宝星星评分功能实例
Sep 12 Javascript
一款基jquery超炫的动画导航菜单可响应单击事件
Nov 02 Javascript
Jquery+ajax+JAVA(servlet)实现下拉菜单异步取值
Mar 23 Javascript
jQuery实现鼠标滚动图片延迟加载效果附源码下载
Jun 28 Javascript
详解js中的apply与call的用法
Jul 30 Javascript
购物车前端开发(jQuery和bootstrap3)
Aug 27 Javascript
基于input框覆盖掉数字英文的实例讲解
Jul 21 Javascript
ES6扩展运算符用法实例分析
Oct 31 Javascript
微信小程序日历/日期选择插件使用方法详解
Dec 28 Javascript
使用VScode 插件debugger for chrome 调试react源码的方法
Sep 13 Javascript
JS实现简单日历特效
Jan 03 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
fleaphp下不确定的多条件查询的巧妙解决方法
2008/09/11 PHP
php抓取网站图片并保存的实现方法
2015/10/29 PHP
PHP PDOStatement::nextRowset讲解
2019/02/01 PHP
ThinkPHP5.0框架实现切换数据库的方法分析
2019/10/30 PHP
js 模拟气泡屏保效果代码
2010/07/10 Javascript
查看大图功能代码jquery版
2013/11/05 Javascript
open 动态修改img的onclick事件示例代码
2013/11/13 Javascript
JS实现鼠标点击展开或隐藏表格行的方法
2015/03/03 Javascript
jquery实现倒计时功能
2015/12/28 Javascript
JavaScript实现身份证验证代码
2016/02/17 Javascript
使用伪命名空间封装保护独自创建的对象方法
2016/08/04 Javascript
一份超级详细的Vue-cli3.0使用教程【推荐】
2018/11/15 Javascript
javascript异步处理与Jquery deferred对象用法总结
2019/06/04 jQuery
vue实现设置载入动画和初始化页面动画效果
2019/10/28 Javascript
解决vue组件中click事件失效的问题
2019/11/09 Javascript
解决VUE项目localhost端口服务器拒绝连接,只能用127.0.0.1的问题
2020/08/14 Javascript
[46:02]DOTA2上海特级锦标赛D组资格赛#2 Liquid VS VP第二局
2016/02/28 DOTA
Python中还原JavaScript的escape函数编码后字符串的方法
2014/08/22 Python
python常规方法实现数组的全排列
2015/03/17 Python
numpy.delete删除一列或多列的方法
2018/04/03 Python
Python实现输出某区间范围内全部素数的方法
2018/05/02 Python
详解Python数据可视化编程 - 词云生成并保存(jieba+WordCloud)
2019/03/26 Python
windows10在visual studio2019下配置使用openCV4.3.0
2020/07/14 Python
详解Python3 定义一个跨越多行的字符串的多种方法
2020/09/06 Python
实例教程 纯CSS3打造非常炫的加载动画效果
2014/11/05 HTML / CSS
迪士尼英国官方商店:shopDisney UK
2019/09/21 全球购物
青年文明号创建承诺
2014/03/31 职场文书
汉语专业毕业生自荐信
2014/07/06 职场文书
银行业务授权委托书
2014/10/10 职场文书
财产分割协议书范本
2014/11/03 职场文书
2014年前台个人工作总结
2014/11/14 职场文书
元宵节寄语大全
2015/02/27 职场文书
党员干部学习十八届五中全会精神心得体会
2016/01/05 职场文书
《合作意向书》怎么写?
2019/08/20 职场文书
如何利用python和DOS获取wifi密码
2021/03/31 Python
Java版 单机五子棋
2022/05/04 Java/Android