vue中的computed的this指向问题

共计 513 个字符，预计需要花费 2 分钟才能阅读完成。

今天在写 vue 项目时，用到了 computed 计算属性，遇到了使用箭头函数出现 this 指向问题，这里记录下
1. 箭头函数中的 this

箭头函数内部的 this 是词法作用域，由上下文确定
函数体内的 this 对象，就是定义时所在的对象，而不是使用时所在的对象

2.vue 中的 computed
使用箭头函数
list: () => {
console.log(this)
}

不使用箭头函数
allFigure: function() {
console.log(this)
},

使用 get()
allFigure: {
get() {
console.log(this);
}
}

3. 自己的理解

在 computed 中使用箭头函数的话，会导致 this 指向的不是整个的 vueComponent
此时使用匿名函数的形式就可以解决，this 指向了 vueComponent
或者使用对象的形式，用 set()、get() 方法也不会出现问题

正在努力学习中，若对你的学习有帮助，留下你的印记呗（点个赞咯 ^_^）

往期好文推荐：

判断 iOS 和 Android 及 PC 端
纯 css 实现瀑布流（multi-column 多列及 flex 布局）
时间戳转换成时间日期格式及去重
微信小程序之购物车和父子组件传值及 calc 的注意事项