Vue.js 监听属性学习笔记

在Vue.js中，我们可以使用watch选项来监听某个数据的变化。当数据发生变化时，watch中的回调函数就会被触发。

监听对象属性

如果我们要监听一个对象的属性，则可以使用深度监听（deep）选项。它表示是否要递归监听对象内部属性的变化。

javascriptCopy Code
var vm = new Vue({
  data: {
    obj: {
      prop: 'hello'
    }
  },
  watch: {
    'obj': {
      handler: function (val, oldVal) {
        console.log('obj changed');
      },
      deep: true
    }
  }
});

vm.obj.prop = 'world'; // 输出 "obj changed"

在上面的例子中，我们监听了obj对象，并且打开了深度监听。当obj内部的属性prop发生变化时，watch回调函数就会被触发。

监听数组变化

Vue.js还提供了一些特定的方法来监听数组的变化。其中最常用的是push、pop、shift、unshift、splice、sort和reverse方法。

javascriptCopy Code
var vm = new Vue({
  data: {
    arr: [1,
[Something went wrong, please try again later.]