vue 监听变量值的实时变动 watch

1 使用字符串形式的侦听器函数

watch: {
    'dataSetting.reverse_y'(newVal, oldVal) {
      console.log(`reverse_y 值从 ${oldVal} 变成了 ${newVal}`);
    }
  }

2 使用函数形式的侦听器函数

watch: {
  'dataSetting.reverse_y': function (newVal, oldVal) {
    console.log('reverse_y 值发生变化了，新值为：', newVal);
  }
}

3

在使用 Vue 的 watch 监听属性时，可以使用两种写法：

1.使用字符串形式的侦听器函数：'dataSetting.reverse_y' 这种写法会自动绑定到 Vue 实例上，并被解析为一个函数，函数内部的 this 指向 Vue 实例本身。

2.使用函数形式的侦听器函数：function (newVal, oldVal) {} 这种写法需要手动绑定，使用 bind 方法将函数绑定到 Vue 实例上，或者使用箭头函数，让函数内部的 this 自动绑定到 Vue 实例上。使用函数形式时，要使用 this.dataSetting.reverse_y 来访问 Vue 实例中的数据属性。