微信小程序错误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静态作用域的功能。
Dec 25 Javascript
js移除事件 js绑定事件实例应用
Nov 28 Javascript
JScript分割字符串示例代码
Sep 04 Javascript
js获得页面的高度和宽度的方法
Feb 23 Javascript
js获取字符串最后一位方法汇总
Nov 13 Javascript
JavaScript利用Date实现简单的倒计时实例
Jan 12 Javascript
vue.js源代码core scedule.js学习笔记
Jul 03 Javascript
基于js中document.cookie全面解析
Sep 14 Javascript
js注册时输入合法性验证方法
Oct 21 Javascript
vue项目设置scrollTop不起作用(总结)
Dec 21 Javascript
vue子组件改变父组件传递的prop值通过sync实现数据双向绑定(DEMO)
Feb 01 Javascript
JavaScript中继承原理与用法实例入门
May 09 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 学习资料零碎东西
2010/12/04 PHP
Drupal简体中文语言包安装教程
2014/09/27 PHP
PHP采用curl模仿用户登陆新浪微博发微博的方法
2014/11/07 PHP
php析构函数的简单使用说明
2015/08/24 PHP
PHP数组去重的更快实现方式分析
2018/05/09 PHP
PHP类的自动加载与命名空间用法实例分析
2020/06/05 PHP
javascript cookie解码函数(兼容ff)
2008/03/17 Javascript
js left,right,mid函数
2008/06/10 Javascript
jQuery学习总结之jQuery事件
2014/06/30 Javascript
jQuery图片轮播滚动切换代码分享
2020/04/20 Javascript
javascript弹出窗口实现代码
2015/11/12 Javascript
全面解析JavaScript的Backbone.js框架中的Router路由
2016/05/05 Javascript
微信小程序 底部导航栏目开发资料
2016/12/05 Javascript
如何解决jQuery EasyUI 已打开Tab重新加载问题
2016/12/19 Javascript
JavaScript和jQuery制作光棒效果
2017/02/24 Javascript
JavaScript数据结构之二叉树的删除算法示例
2017/04/13 Javascript
Angular使用cli生成自定义文件、组件的方法
2018/09/04 Javascript
基于Nodejs的Tcp封包和解包的理解
2018/09/19 NodeJs
vue插件mescroll.js实现移动端上拉加载和下拉刷新
2019/03/07 Javascript
JS实现倒序输出的几种常用方法示例
2019/04/13 Javascript
微信小程序实现图片选择并预览功能
2019/07/25 Javascript
Layui表格行工具事件与数据回填方法
2019/09/13 Javascript
js实现中文实时时钟
2020/01/15 Javascript
python超简单解决约瑟夫环问题
2015/05/12 Python
python压缩文件夹内所有文件为zip文件的方法
2015/06/20 Python
python opencv实现旋转矩形框裁减功能
2018/07/25 Python
python 串口读取+存储+输出处理实例
2019/12/26 Python
用pandas划分数据集实现训练集和测试集
2020/07/20 Python
Python爬虫+Tkinter制作一个翻译软件的示例
2021/02/20 Python
2014社区三八妇女节活动总结
2014/03/01 职场文书
超市促销活动方案
2014/03/05 职场文书
给校长的一封检讨书
2014/09/20 职场文书
基层干部个人对照检查及整改措施
2014/10/28 职场文书
小学班主任评语
2014/12/29 职场文书
银行资信证明
2015/06/17 职场文书
Python极值整数的边界探讨分析
2021/09/15 Python