vue侦听器（Watch）精彩案例剖析二

目录

监视数组类型

computed和watch的区别

$watch

---

vue侦听器（Watch）精彩案例剖析一-CSDN博客

监视数组类型

---

        通常而言，监听在默认情况下无法监测到对象属性值的变化，但数组值的变化是能够被监听的。所以，对于数组的变化，无需进行深度监听。即便没有将 deep 设置为 true ，当数组值发生改变时，监听函数依然会执行。

        示例代码如下：

<!--html-->    
<el-checkbox :label="item" v-for="(item,i) in likes" :key="i"></el-checkbox>   
<div><el-button type="primary" @click="changeArr">改变数组值</el-button></div>   
<!--js-->  
data(){  
    return{  
        likes:['hiphop','singing','drawing']  
    }  
},  
watch:{  
    likes:{  
        handler(newLikes,oldLikes){  
            console.log(newLikes,oldLikes)  
        },  
        immediate:true  
    }  
},  
methods:{  
        changeArr(){  
            this.likes=['街舞','唱歌','画画'];  
        }  
    }  
})  

        当单击“改变数组值”按钮时，数组数据产生变化，将会触发对应的handler，运行结果：