微信小程序错误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 css 设置table的奇偶行背景色示例
Jun 03 Javascript
jQuery中each()方法用法实例
Dec 27 Javascript
全面理解闭包机制
Jul 11 Javascript
Javascript中数组去重与拍平的方法示例
Feb 03 Javascript
Vue实现百度下拉提示搜索功能
Jun 21 Javascript
webpack配置导致字体图标无法显示的解决方法
Mar 06 Javascript
jquery ajaxfileuplod 上传文件 essyui laoding 效果【防止重复上传文件】
May 26 jQuery
使用Vue实现移动端左滑删除效果附源码
May 16 Javascript
JavaScript遍历查找数组中最大值与最小值的方法示例
May 24 Javascript
微信小程序自定义头部导航栏和导航栏背景图片 navigationStyle问题
Jul 26 Javascript
layui操作列按钮个数和文字颜色的判断实例
Sep 11 Javascript
JS hasOwnProperty()方法检测一个属性是否是对象的自有属性的方法
Jan 29 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 session常见问题集锦及解决办法总结
2007/03/18 PHP
PHP中常用数组处理方法实例分析
2008/08/30 PHP
PHP IPV6正则表达式验证代码
2010/02/16 PHP
php数组中删除元素的实现代码
2012/06/22 PHP
详解Yii2.0 rules验证规则集合
2017/03/21 PHP
YII2框架中ActiveDataProvider与GridView的配合使用操作示例
2020/03/18 PHP
JScript内置对象Array中元素的删除方法
2007/03/08 Javascript
js实现的网站首页随机公告随机公告
2007/03/14 Javascript
JavaScript CSS修改学习第二章 样式
2010/02/19 Javascript
Javascript显示和隐藏ul列表的方法
2015/07/15 Javascript
jQuery+jsp下拉框联动获取本地数据的方法(附源码)
2015/12/03 Javascript
不同js异步函数同步的实现方法
2016/05/28 Javascript
JS声明式函数与赋值式函数实例分析
2016/12/13 Javascript
javaScript嗅探执行神器-sniffer.js
2017/02/14 Javascript
vue中使用localstorage来存储页面信息
2017/11/04 Javascript
vue2.0+vue-dplayer实现hls播放的示例
2018/03/02 Javascript
基于Angular中ng-controller父子级嵌套的相关属性详解
2018/10/08 Javascript
通过扫小程序码实现网站登陆功能
2019/08/22 Javascript
微信sdk实现禁止微信分享(使用原生php实现)
2019/11/15 Javascript
vue-openlayers实现地图坐标弹框效果
2020/09/24 Javascript
[05:03]显微镜下的DOTA2第十期——Ti3豪之超神幽鬼
2014/06/23 DOTA
Python的Django框架中从url中捕捉文本的方法
2015/07/20 Python
django框架实现一次性上传多个文件功能示例【批量上传】
2019/06/19 Python
Django和Flask框架优缺点对比
2019/10/24 Python
浅析python内置模块collections
2019/11/15 Python
python 中的paramiko模块简介及安装过程
2020/02/29 Python
pycharm中导入模块错误时提示Try to run this command from the system terminal
2020/03/26 Python
高三自我评价
2014/02/01 职场文书
大学奖学金获奖感言
2014/08/15 职场文书
大型主题婚礼活动策划方案
2014/09/15 职场文书
置业顾问岗位职责
2015/02/09 职场文书
活动主持人开场白
2015/05/28 职场文书
无房证明样本
2015/06/17 职场文书
驾驶员管理制度范本
2015/08/06 职场文书
redis实现排行榜功能
2021/05/24 Redis
Python开发之QT解决无边框界面拖动卡屏问题(附带源码)
2021/05/27 Python