Vue中关于this指向的问题，如何通过箭头函数或绑定方法解决，避免在组件方法中丢失上下文？

本文共计689个文字，预计阅读时间需要3分钟。

目录- Vue管理的函数- 不被Vue管理的函数- this指向导致的分类- 总结- 在Vue中，方法体中使用this调用vue实例的数据，有时会指向window，导致调用失败。

Vue管理的函数- 例如：computed（计算属性）

不被Vue管理的函数- 如：事件处理函数、watcher回调等

this指向导致的分类- 方法体中使用this调用vue实例的数据- 有时会指向window，导致调用失败

总结- 理解Vue中this的指向对于避免调用错误非常重要。

目录

• 由Vue管理的函数
• 不被vue管理的函数
• this指向大致分类
• 总结

在Vue中，方法体里用this调用vue实例的数据，有时会指向window，导致调用失败报错。

由Vue管理的函数

例如：

• computed 计算属性
• watch 监视属性
• filters (Vue3中已弃用且不再支持) 过滤器....

上述属性里配置的函数不要采用箭头函数写法，因为箭头函数没有自己的this对象，使用this时会向外找到window，不会指向Vue实例，也就调用不到Vue中的数据。