Vue公司/ Nuxt - 安装:()=> Vs的安装:()的函数
问题描述:
为什么结果在mounted
是使用() =>
和function()
不同:Vue公司/ Nuxt - 安装:()=> Vs的安装:()的函数
export default {
mounted:() => {
this.socket = 'something'
console.log('mounted')
},
methods: {
submitMessage() {
console.log(this.socket) // undefined
}
}
}
使用function()
:
export default {
mounted: function() {
this.socket = 'something'
console.log('mounted')
},
methods: {
submitMessage() {
console.log(this.socket) // something
}
}
}
不限想法?
答
您不应该使用箭头函数来定义生命周期挂钩,方法...(例如mounted:() => this.socket++
)。原因是箭头函数绑定父上下文,所以这不会是你期望的Vue实例,并且this.socket
将会是未定义的。
感谢您的回答。 – laukok
这是很好的答案。但@laukok你应该在JavaScript中学习并理解关于箭头函数和关键字'this'的绑定概念。它会在很大程度上帮助你。 'console.log(this)'帮助我知道这是什么 – fajarhac