vue中watch的简单用法和详细用法

例子

<el-checkbox-group v-model="checkedValue">

<el-checkbox v-for="people in goods" :label="people" :key="people" v-model="checkedValue" class="pop_msg">{{people.name }}&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;{{ people.address }}</el-checkbox>

</el-checkbox-group>

首先通过v-model绑定数据

在data里面设置

data:{

checkedValue:[]  //必须是数组

answer:[]   //设置一个空数组

}

使用watch方法

watch:{

  checkedValue:function(new,old){

    this.answer=this.checkedValue

}

}

使用watch方法来监听数据的改变

当然当前这个只能checkedValue发生变化时，才能监听到变化。如果checkedValue第一次赋值时就能监听到变化就需要使用handler和immddiate

例如

watch:{

  checkedValue:{

    handler(new,old){

    this.answer=this.checkedValue

  },

  immediate:true

}

如果需要深度监听的话，就需要deep属性

watch:{

  checkedValue:{

    handler(new,old){

    this.answer=this.checkedValue

  },

  immediate:true,

  deep:true

}