Vue2.0——监听器watch

致可乐

于 2021-08-10 10:51:33 发布

阅读量461

点赞数

分类专栏：笔记

本文链接：https://blog.youkuaiyun.com/ling_xy/article/details/119548636

版权

本文深入探讨Vue2.0中的监听器watch，解释其用于响应数据变化的概念，并通过全选/取消功能的案例展示其实用性，特别是在处理异步或资源密集型操作时。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

文章目录

1.概念
2.案例

1.概念

watch监听器监听组件上的变化

watch 选项提供了一个更通用的方法，来响应数据的变化。
当需要在数据变化时执行异步或开销较大的操作时，这个方式是最有用的

    {
   {
   msg}}
    <input type="text" v-model="msg">

	data(){
   
        return{
   
            msg:"9527",
        }
    },
	methods:{
   
        sendMsg(){
   
            console.log("监听到变化后执行该方法");
        }
    },
    watch:{
   
        //把监听变量作为函数名称
        msg(newValue,oldValue){
   
            console.log("属性发生改变",newValue,oldValue);
            console.log(this)