微信小程序success中使用this

在微信小程序中,由于success回调函数内的this并非指向全局对象,导致使用this调用方法时出现错误。解决方法包括使用ES6箭头函数以保持this指向,或者在闭包外将this赋值给一个变量并在回调中使用。理解普通函数与箭头函数中this的不同对于解决这类问题至关重要。
摘要由CSDN通过智能技术生成

问题:在微信小程序—success回调函数使用this.报错

wx.showModal({
  title: '提示',
  content: '您是否要删除',
  success (res) {
    if (res.confirm) {
      car.splice(index,1);
      this.setCat(cat);    //setCat自己封装的一个方法
    } else if (res.cancel) {
      console.log('用户点击取消')
    }
  }
})

报错原因
普通函数中,this的概念是:this是JavaScript的一个关键字,他是指函数执行过程中,自动生成的一个内部对象,是指当前的对象,只在当前函数内部使用。(this对象是在运行时基于函数的执行环境绑定的:在全局函数中,this指向的是window;当函数被作为某个对象的方法调用时,this就等于那个对象)。
回调函数中使用的this关键字,是在回调函数创建过程中再次生成的一个对象,并不是指向一个全局对象,所以报错找不到相应的属性或者方法。
解决方法:es6箭头函数

wx.showModal({
  title: '提示',
  content: '您是否要删除',
  success:(res)=> {     //使用箭头函数
    if (res.confirm) {
      car.splice(index,1);
      this.setCat(cat);    //setCat自己封装的一个方法
    } else if (res.cancel) {
      console.log('用户点击取消')
    }
  }
})

普通函数中和ES6箭头函数中this的区别

  • 普通函数
    • 定义:普通函数的this是指函数执行过程中,自动生成的一个内部对象,是指当前的对象,只在当前函数内部使用。回调函数中,当函数被作为某个对象的方法调用时,this就等于那个对象。
    • 解释:每次在执行一个函数的过程中,每一个函数都会生成一个相对应的this对象。这些this对象不同。
  • ES6箭头函数
    • 定义:箭头函数的this是在定义函数时绑定的,不是在执行过程中绑定的。简单的说,函数在定义时,this就继承了定义函数的对象。
    • 解释:箭头函数中定义的this,会自动继承全局this。

解决方法2在闭包之外先把this赋值给另一个变量

wx.showModal({
  let _this = this //success闭包之前把全局this赋值给另一个变量
  title: '提示',
  content: '您是否要删除',
  success(res) {
    if (res.confirm) {
      car.splice(index,1);
      _this.setCat(cat);    //setCat自己封装的一个方法
    } else if (res.cancel) {
      console.log('用户点击取消')
    }
  }
})

参考:https://www.cnblogs.com/zuiyue_jing/p/12235644.html

  • 3
    点赞
  • 8
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
下面是一个简单的微信小程序使用`wx.onSocketOpen`的示例代码: ```javascript Page({ data: { socketMsg: '', socketOpen: false }, onLoad: function () { // 打开WebSocket连接 wx.connectSocket({ url: 'wss://example.com/socket', success: () => { console.log('WebSocket连接成功') } }) // 监听WebSocket连接打开事件 wx.onSocketOpen(() => { console.log('WebSocket连接已打开') this.setData({ socketOpen: true }) }) // 监听WebSocket接收到服务器的消息事件 wx.onSocketMessage((res) => { console.log('收到服务器消息:', res.data) this.setData({ socketMsg: res.data }) }) // 监听WebSocket错误事件 wx.onSocketError((res) => { console.error('WebSocket连接错误:', res) }) // 监听WebSocket关闭事件 wx.onSocketClose(() => { console.log('WebSocket连接已关闭') this.setData({ socketOpen: false }) }) }, // 发送消息给服务器 sendMsg: function () { if (this.data.socketOpen) { wx.sendSocketMessage({ data: 'Hello, WebSocket!' }) } else { wx.showToast({ title: 'WebSocket未连接', icon: 'none' }) } } }) ``` 在这个示例代码,我们使用`wx.connectSocket`打开一个WebSocket连接,并在成功连接后,使用`wx.onSocketOpen`监听WebSocket连接打开事件。当WebSocket连接打开时,我们将`socketOpen`数据设置为`true`。 在接下来的代码,我们使用`wx.onSocketMessage`监听WebSocket接收到服务器的消息事件,并将接收到的消息通过`setData`方法保存到`socketMsg`数据。 当WebSocket连接发生错误时,我们使用`wx.onSocketError`监听错误事件,并在控制台输出错误信息。 最后,我们使用`wx.onSocketClose`监听WebSocket关闭事件,并将`socketOpen`数据设置为`false`。 除此之外,在这个示例代码还包含了一个`sendMsg`方法,用于发送消息给服务器。在点击发送按钮时,我们通过判断`socketOpen`数据的值来确定WebSocket是否已连接。如果已连接,我们使用`wx.sendSocketMessage`方法发送一条消息。如果未连接,我们使用`wx.showToast`方法显示一个提示信息。 希望这个示例代码能够帮助你理解如何在微信小程序使用`wx.onSocketOpen`。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值