watch的详细使用场景

我们平时在使用watch的时候可能就是用于监听某个属性，但是当我们需要监听多个属性的时候，这样就比较麻烦了，此时我们需要写多个属性

watch: {
    name: function() {
        console.log(0);
    },
    age: function() {
        console.log(1);
    }
}

那么下面我就说一种比较便捷的方式，来实现watch对多个属性的监听,就是通过watch监听一个对象

data: {
    person: {
        name: "张三",
        age: 0
    }
},
watch: {
    person: {
        handle: function(val, oldVal) {/* 内部做相应的处理 */}，
        deep: true//表示只要person这个对象的某个属性改变时就会调用handle函数，无论其嵌套多深
    }
}

如果我们想在侦听开始之后立即调用watch监听的这个函数，那么我们就可以通过以下这种方式来实现

data: {
    person: {
        name: "张三",
        age: 0
    }
},
watch: {
    person: {
        handle: function(val, oldVal) {/* 内部做相应的处理 */}，
        immediate: true//表示只要person这个对象的某个属性改变时就会调用handle函数，无论其嵌套多深
    }
}

   最后，提一个注意点，在我们使用watch的时候，一定要记住不要使用箭头函数，因为箭头函数是绑定父级上下文的，所以this可能会取不到