当前位置:首页 > 编程笔记 > 正文
已解决

Vue中this指向问题

来自网友在路上 163863提问 提问时间:2023-10-27 21:46:03阅读次数: 63

最佳答案 问答题库638位专家为你答疑解惑

文章目录

  • 1 由Vue管理的函数
  • 2 不被Vue管理的函数
  • 3 总结

1 由Vue管理的函数

  • computed 计算属性
  • watch 监视属性
  • filters (Vue3中已弃用且不再支持) 过滤器
  • methods
    上述属性里配置的函数this指向Vue实例,不要采用箭头函数写法,因为箭头函数没有自己的this对象,使用this时会向外找到window,不会指向Vue实例,也就调用不到Vue中的数据。

2 不被Vue管理的函数

  • setTimeout计时器里的回调函数
  • setInterval定时器里的回调函数
  • ajax请求里的回调函数

上述回调函数使用普通函数定义的话,里面的this指向的是window

所以在被Vue管理的函数中写不被Vue管理的函数,要用箭头函数,此时this会向函数外找,找到Vue实例(因为在vue环境里)。

3 总结

Vue环境里:

  • Vue管理的函数,尽量使用普通函数定义。
  • 不被Vue管理的函数,尽量使用箭头函数定义。
  • 这样保证this总是指向Vue实例,可以调用到Vue数据。
查看全文

99%的人还看了

猜你感兴趣

版权申明

本文"Vue中this指向问题":http://eshow365.cn/6-26335-0.html 内容来自互联网,请自行判断内容的正确性。如有侵权请联系我们,立即删除!