vue中watch监听,调用this时出现undefined

Watch侦听器中,我们要将新的值赋给this.newValue出错,报undefined。

watch: {
 value: (newV, oldV) => {
  this.newValue = newV;
 }
}

这里报错undefined,错误的原因是不能写成箭头函数。写成箭头函数后,this会取上下文,而不是组件里面的this了,正确写法为:

watch: {
 value: function(newV, oldV) {
  this.newValue = newV;
 }
}

官网原话:

注意,不应该使用箭头函数来定义 watcher 函数 (例如 searchQuery: newValue => this.updateAutocomplete(newValue))。理由是箭头函数绑定了父级作用域的上下文,所以 this 将不会按照期望指向 Vue 实例,this.updateAutocomplete 将是 undefined。