vue中的watch作用就如其命名就是监听的作用

比方有个对象

watchData: {    name: '',    age: '',}

监听这个对象的属性

watchData: {    handler: function() {        console.log();    },    deep: true}

监听对象能够用deep，深度监测，不然监测不到对象的变动

监听这个对象的属性

1. 形式一

   watch: { 'watchData.name'(newValue, oldValue) {     console.log(newValue); }}

2. 形式二

watch: {    'watchData.name': {        handler: function() {            console.log();        }    }},

为什么要监听对象的属性，监听对象的话，一旦对象外部的任何数据变动，都会导致watch从新执行，这样的话可能不是你想要的监听某一个属性变动才执行watch，或者是一旦说对象外部任何一个属性变动就让其watch执行，也会对性能有肯定性的损耗，所以咱们用这种监听对象单个属性的形式来解决，给要监听的“对象.属性，用引号包裹起来”

监听这个对象的属性

computed: {    getName() {        return this.watchData.name     }},watch: {    getName(newValue, oldValue) {        console.log(newValue);    }},

这种形式其实和第二种是一样的，区别就是用到了computed，而后再监听办法getName，实际上办法getName返回的就是watchData对象中的name属性