侦听器

侦听器

1.定义

又名:监听器

2.作用

当数据发生改变时,及时作出响应

3.使用

语法

 // 实例化vue
        new Vue({
            el:'#app',
            data:{
                name:'赵丽颖'
            },
            // 监听
            watch:{
                // 监听方法中系统提供了两个参数:
                /**
                 * 参数一:newVal修改后的新值
                 * 参数二:oldVal修改前的旧值
                */
                监听的属性名:function(newVal,oldVal){
                    console.log(newVal);
                    console.log(oldVal);
                }
            }
        })

• 普通监听

// 监听
            watch:{
                监听属性名:function(){
                    // console.log(this.name);
                    this.status = true;
                }
            }

• 深度监听
  • 当数据是对象或者数组对象时,需要使用深度监听

 watch:{
                // 深度监听
                监听的属性名:{
                    // handler是系统自动注入的方法
                    handler(){
                        console.log(this.user.name);
                    },
                    deep:true,//允许深度监听  默认值为false
                }
            }