微信小程序错误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 API学Jquery之一 选择器
Apr 07 Javascript
jQuery最佳实践完整篇
Aug 20 Javascript
解析瀑布流布局:JS+绝对定位的实现
May 08 Javascript
jquery实现滑屏大图定时收缩为小banner图片的广告代码
Sep 02 Javascript
微信公众号 客服接口的开发实例详解
Sep 28 Javascript
AngularJS自定义控件实例详解
Dec 13 Javascript
canvas实现绘制吃豆鱼效果
Jan 12 Javascript
微信小程序 基础知识css样式media标签
Feb 15 Javascript
求js数组的最大值和最小值的四种方法
Mar 03 Javascript
JS仿淘宝搜索框用户输入事件的实现
Jun 19 Javascript
理解Angular的providers给Http添加默认headers
Jul 04 Javascript
vue.js中ref和$refs的使用及示例讲解
Aug 14 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 命名空间实例说明
2011/01/27 PHP
PHP生成指定随机字符串的简单实现方法
2015/04/01 PHP
PHP实现动态获取函数参数的方法示例
2018/04/02 PHP
jquery选择器原理介绍($()使用方法)
2014/03/25 Javascript
javascript 动态创建表格
2015/01/08 Javascript
jQuery处理json数据返回数组和输出的方法
2015/03/11 Javascript
javascript self对象使用详解
2016/10/18 Javascript
jQuery使用DataTable实现删除数据后重新加载功能
2017/02/27 Javascript
移动端触屏幻灯片图片切换插件idangerous swiper.js
2017/04/10 Javascript
AngularJS实现动态添加Option的方法
2017/05/17 Javascript
深入理解vue-router之keep-alive
2017/08/31 Javascript
Vue2 SSR渲染根据不同页面修改 meta
2017/11/20 Javascript
原生JS实现的多个彩色小球跟随鼠标移动动画效果示例
2018/02/01 Javascript
JavaScript 下载svg图片为png格式
2018/06/21 Javascript
apicloud拉起小程序并传递参数的方法示例
2018/11/21 Javascript
VSCode使用之Vue工程配置eslint
2019/04/30 Javascript
jquery实现二级导航下拉菜单效果实例
2019/05/14 jQuery
JS实现从对象获取对象中单个键值的方法示例
2019/06/05 Javascript
微信小程序地图绘制线段并且测量(实例代码)
2020/01/02 Javascript
vue-cli+webpack项目打包到服务器后,ttf字体找不到的解决操作
2020/08/28 Javascript
[40:03]DOTA2上海特级锦标赛主赛事日 - 1 败者组第一轮#1EHOME VS Archon
2016/03/02 DOTA
python用装饰器自动注册Tornado路由详解
2017/02/14 Python
Numpy array数据的增、删、改、查实例
2018/06/04 Python
python实现将文件夹内的每张图片批量分割成多张
2019/07/22 Python
Python with语句和过程抽取思想
2019/12/23 Python
python实现从尾到头打印单链表操作示例
2020/02/22 Python
Python轻量级web框架bottle使用方法解析
2020/06/13 Python
使用SVG实现提示框功能的示例代码
2020/06/05 HTML / CSS
Beauty Expert美国/加拿大:购买奢侈美容产品
2018/12/05 全球购物
内容编辑个人求职信
2013/12/10 职场文书
家佳咖啡店创业计划书
2013/12/27 职场文书
《花的勇气》教后反思
2014/02/12 职场文书
学雷锋的心得体会
2014/09/04 职场文书
冬季作息时间调整通知
2015/04/24 职场文书
redis实现排行榜功能
2021/05/24 Redis
Python中常见的反爬机制及其破解方法总结
2021/06/10 Python