微信小程序this.setData

data: {
  daAn1:"good"
  },
onLoad(options) {
    wx.request({
      url: 'http://localhost/zerg/public/index.php/api/v1.banner/getquestionbyid?id=100001&id1=个税',
      success(res){
          console.log(res.data[0].course_name)
          this.setData({
            daAn1:res.data[0].course_name
          })
      }
    })
  },

复制
我用以上代码，从服务器返回值，用 console.log(res.data[0].course_name)，打印，显示成功，结果就是一个字符串：“个税”，但我想把这个返回值用this.setData做数据绑定给已经定义好的变量daAn1时,总是显示错误：

WAServiceMainContext.js:2
TypeError: Cannot read property ‘setData’ of undefined
at success (zhan.js? [sm]:21)
at Function.forEach.s. (WASubContext.js?t=wechat&s=1691319802498&v=2.19.4:2)
at :49654/appservice/
at WASubContext.js?t=wechat&s=1691319802498&v=2.19.4:2
at u (WASubContext.js?t=wechat&s=1691319802498&v=2.19.4:2)
at o. (WASubContext.js?t=wechat&s=1691319802498&v=2.19.4:2)
at :49654/appservice/
at WASubContext.js?t=wechat&s=1691319802498&v=2.19.4:2
at WASubContext.js?t=wechat&s=1691319802498&v=2.19.4:2
at WASubContext.js?t=wechat&s=1691319802498&v=2.19.4:2(env: Windows,mp,1.06.2306020; lib: 2.19.4)

请问为什么数据绑定不成功？

引用chatgpt内容作答：
你遇到的问题是由于wx.request的success回调函数中this的上下文不同导致的。在JavaScript中，回调函数内部的this可能与外部上下文不同，这导致了你遇到的错误。

为了解决这个问题，你可以使用箭头函数来作为success回调函数。箭头函数没有自己的this，它会使用外部作用域的this值。下面是修改后的代码，确保this指向正确的上下文：

data: {
  daAn1: "good"
},
onLoad(options) {
  wx.request({
    url: 'http://localhost/zerg/public/index.php/api/v1.banner/getquestionbyid?id=100001&id1=个税',
    success: (res) => { // 使用箭头函数
      console.log(res.data[0].course_name);
      this.setData({
        daAn1: res.data[0].course_name
      });
    }
  });
},

通过使用箭头函数，success回调函数内部的this将指向和onLoad方法中的this相同，这样setData函数就会按预期工作。

箭头函数在旧版本的浏览器或JavaScript引擎中可能不受支持，但在微信小程序的环境中，由于使用了较新版本的V8引擎执行JavaScript代码，它应该能正常工作。

用个局部变量that指向this，在接口sucess里面有这个that.setData

根据你的代码和报错信息来看，问题似乎出在 this 的指向。在 onLoad 函数中，this 指向的是 onLoad 函数自身，而不是整个组件实例。
因此，当你尝试使用 this.setData 时，它无法找到 setData 方法，因为 this 实际上并不指向组件实例。
解决此问题的一种方法是使用箭头函数，箭头函数没有自己的 this，而是继承了包含它的函数的 this。
下面是修改后的代码：

data: {  
  daAn1:"good"  
},  
  
onLoad: async () => {  
  try {  
    const res = await wx.request({  
      url: 'http://localhost/zerg/public/index.php/api/v1.banner/getquestionbyid?id=100001&id1=个税',  
    });  
    console.log(res.data[0].course_name);  
    this.setData({  
      daAn1: res.data[0].course_name,  
    });  
  } catch (err) {  
    console.error(err);  
  }  
},

#如有帮助，恭请采纳

🟢修改一下你的代码

success: (res)=>{
。。 。。。。。。
。。。。。。。。
       },

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

【以下回答由 GPT 生成】

问题的原因是在 success 函数中，this.setData 的 this 指向发生了错误，导致无法调用 setData 方法。这是因为在回调函数中，this 的指向发生了改变，不再指向当前的 Page 对象。解决这个问题的方法是将 this 存储在一个变量中，然后在回调函数中使用这个变量。具体的解决方案如下：

onLoad(options) {
  var that = this; // 存储 this 对象

  wx.request({
    url: 'http://localhost/zerg/public/index.php/api/v1.banner/getquestionbyid?id=100001&id1=个税',
    success(res){
      console.log(res.data[0].course_name)
      that.setData({
        daAn1: res.data[0].course_name
      })
    }
  })
}

我们在回调函数中使用了变量 that 来代替 this，这样就能够正确地调用 that.setData 方法了。