watch侦听器

watch侦听器：用来监听数据产生变化后调用该函数

    watch 侦听器允许开发者监视数据的变化，从而针对数据的变化做特定的操作如下：

    immediate : true | false  : 添加该方法代表当刷新页面时会立即自动触发一次 handler 函数

    deep ： true | false 监听对象中每个属性值的变化

    handler: 其值是一个回调函数, 即监听到变化时应该执行的函数

   

const vm = new vue({

    el:'#app',

    data:{

        username : ''

        info:{

            name : '',

            user : ''

        }

               

    },

    watch:{ //当监听的数据发生变化事触发该事件

        username(newVal,oldVal){ // 两种写法 第一种
            //newVal : 是变化后的值  。oldVal 是变化之前的值
        }

        username:{ //第二种方法是添加 immediate 自动触发一次

            //侦听器的处理函数

            handler(newVal,oldVal){
                //处理条件
            },

            immediate : true
        },


        
        //对象数据监听
        info:{

            //侦听器的处理函数

            handler(newVal){ //该对象中任何值发生变化都会触发一次该侦听器

                //处理条件
            },


            deep : true
        }

        //如果只想监听对象中单个属性的变化，可以按如下方法操作

        'info.name'(newVal, oldVal){ //单一对象的获取方法


         }
        
        'info.name':{ //单一对象的获取方法

             handler(newVal){ //该对象中任何值发生变化都会触发一次该侦听器

                //处理条件
            }

        }


       }

})