微信小程序success中使用this

问题:在微信小程序—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

你可能感兴趣的:(es6,小程序,es6)