微信小程序错误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 相关文章推荐
js模拟点击以提交表单为例兼容主流浏览器
Nov 29 Javascript
JavaScript 开发工具webstrom使用指南
Dec 09 Javascript
基于jquery ui的alert,confirm方案(支持换肤)
Apr 03 Javascript
js中利用cookie实现记住密码功能
Aug 20 Javascript
JavaScript简单拖拽效果(1)
May 17 Javascript
Javascript实现base64的加密解密方法示例
Jun 27 Javascript
阿里大于短信验证码node koa2的实现代码(最新)
Sep 07 Javascript
vue 使用Jade模板写html,stylus写css的方法
Feb 23 Javascript
JS实现图片旋转动画效果封装与使用示例
Jul 09 Javascript
微信小程序左滑删除功能开发案例详解
Nov 12 Javascript
Vue表单提交点击事件只允许点击一次的实例
Oct 23 Javascript
jquery插件实现代码雨特效
Apr 24 jQuery
解决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 文章采集正则代码
2009/12/28 PHP
PHP迭代器实现斐波纳契数列的函数
2013/11/12 PHP
php缓冲输出实例分析
2015/01/05 PHP
PHP实现上传文件并存进数据库的方法
2015/07/16 PHP
PHP设计模式之注册树模式分析
2018/01/26 PHP
实例讲解PHP表单
2020/06/10 PHP
对之前写的jquery分页做下升级
2014/06/19 Javascript
jQuery时间轴插件使用详解
2015/07/16 Javascript
JavaScript比较当前时间是否在指定时间段内的方法
2016/08/02 Javascript
JS+HTML5实现上传图片预览效果完整实例【测试可用】
2017/04/20 Javascript
Angular4.x通过路由守卫进行路由重定向实现根据条件跳转到相应的页面(推荐)
2018/05/10 Javascript
vue 自定义组件的写法与用法详解
2020/03/04 Javascript
javascript+css实现进度条效果
2020/03/25 Javascript
Python中函数的多种格式和使用实例及小技巧
2015/04/13 Python
Python进程间通信用法实例
2015/06/04 Python
Python中方法链的使用方法
2016/02/23 Python
python paramiko模块学习分享
2017/08/23 Python
Python实现随机生成手机号及正则验证手机号的方法
2018/04/25 Python
Python绘制频率分布直方图的示例
2019/07/08 Python
Python装饰器用法与知识点小结
2020/03/09 Python
Python参数传递机制传值和传引用原理详解
2020/05/22 Python
css3 transform导致子元素固定定位变成绝对定位的方法
2020/03/06 HTML / CSS
C#中有没有运算符重载?能否使用指针?
2014/05/05 面试题
幼儿教师个人求职信范文
2013/09/21 职场文书
班组长岗位职责范本
2014/01/05 职场文书
第一批党的群众路线教育实践活动工作总结
2014/03/03 职场文书
离婚协议书范本(2014版)
2014/09/28 职场文书
2014年无财产无子女离婚协议书范本
2014/10/09 职场文书
关于学习的决心书
2015/02/05 职场文书
社区党员干部承诺书
2015/05/04 职场文书
自信主题班会
2015/08/14 职场文书
2016年幼儿园教师政治学习心得体会
2016/01/23 职场文书
想要创业,那么你做好准备了吗?
2019/07/01 职场文书
nginx简单配置多个server的方法
2021/03/31 Servers
我们认为中短波广播场强仪的最佳组合
2022/04/05 无线电
nginx实现多geoserver服务的负载均衡
2022/05/15 Servers