【微信小程序】TypeError: Cannot read property 'setData' of undefined

本文介绍了在微信小程序开发中,使用wx.getSystemInfo()获取系统信息时,遇到this.setData()报错的问题。通过对比function()和箭头函数=>的this指向差异,解释了错误原因,并提供了将function()替换为箭头函数=>的解决方案。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

自己在调用wx.getSystemInfo({})时,开发工具自动补全了代码。在success回调中按照以往的写法调用this.setData({ });时,报错:TypeError: Cannot read property 'setData' of undefined。

相关代码如下:


 /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    wx.getSystemInfo({
      success: function (res) {
        console.log(res);
        this.setData({
          system_info: res.brand,
        });
      },
      fail: function (res) {
        this.myShowError("获取手机系统信息")
      },
      complete: function (res) { },
    })

  },

仔细对比和之前绑定事件调用this.setData({ });时相比,调用方式并没有什么差别。因为刚接触小程序开发,success: function (res) {};这种写法没见过,所以猜想问题可能出在这里了。该用以下方式即可正常使用。

 /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    wx.getSystemInfo({
      success: (res) => {
        console.log(res);
        this.setData({
          system_info: res.brand,
        });
      },
      fail: function (res) {
        this.myShowError("获取手机系统信息")
      },
      complete: function (res) { },
    })

  },

解决方案:

success: function (res) {
   this.setData({})
}

改为

success: (res) =>  {
   this.setData({})
}

 

【原因分析】

为什么呢?

因为两种写法this指向不同。

success: (res) => {
        console.log("(res) => { }时:" + this);
      },

--------------

success: function (res){
        console.log("function (res)时:" + this);
       },

对比分析:

function (res)时:undefined
 (res) => { }时:[object Object]

function (res)写法时 ,this是undefined未定义的。
(res) => { }写法时this是Object。

【分析总结】
1、如果函数作为对象的方法调用,this指向的是这个上级对象,即调用方法的对象。
2、如果是构造函数中的this,则this指向新创建的对象本身。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值