watch监听器，和深度监听

---

一、监听器watch

1.watch简单使用

watch中的msg 对应的是 data中的msg，newV是改变后的值，oldV是原始值，当改变后的值为true，触发弹框

代码如下（示例）：

<div id="app">
    <h3> {{msg}}</h3>
    <input type="text" v-model="msg">
</div>

new Vue({
        el: "#app",
        data: {
            msg:"苏宁加油！"
        },
        watch:{
            'msg' : function (newV,oldV) {
                if (newV == '赢了'){
                    alert("lpl再次夺冠");
                }
            }
        }
    });

---

2.数组使用深度监听

代码如下（示例）：

  <h3>{{ stus[0].name}}</h3>
    <button v-on:click="stus[0].name = 'uzi' ">点我成为uzi</button>

 new Vue({
        el: "#app",
        data: {
            msg:"苏宁加油！",
            stus:[
                {name: 'gala'}
            ]
        },
        watch:{
            'msg' : function (newV,oldV) {
                if (newV == '赢了'){
                    alert("lpl再次夺冠");
                }
            },
            //数组
            'stus' :{
                deep : 'true',
                handler : function (newV,oldV) {
                    alert("恭喜你成为污渍")
                }
            }
        }
    });

---

总结

daydayup！