首次赋值不触发watch的解决方法
deep,默认值是 false,代表是否深度监听。
immediate:true代表如果在 wacth 里声明了之后,就会立即先去执行里面的handler方法,如果为 false就跟我们以前的效果一样,不会在绑定的时候就执行。
补充知识:在vue中使用watch监测数据改变的deep:true,和immediate:true
在项目中,有时候检测一个变量的值是否反升了变化。通常使用的watch或者使用低效的循环判断。
在次vue中给我们设置了深度监测数据繁盛变化的方法。
1.vue中提供了在watch监听时设置deep:true 就可以实现对对象的深度监听;
2.immediate:true,代表watch里面声明了之后会立马执行handler里面的函数。
JavaScript Code复制内容到剪贴板
- watch: {
- "note":{
- immediate: true,
- handler:function(newVal, oldVal){
- console.log("这是前面传来的 props 值: ", newVal , "原来的值是: " ,oldVal);
- // this.showFlowChart(newVal);
- }
- },
- }
也可以加一行deep
JavaScript Code复制内容到剪贴板
- watch: {
- "note":{
- deep: true,
- immediate: true,
- handler:function(newVal, oldVal){
- console.log("这是前面传来的 props 值: ", newVal , "原来的值是: " ,oldVal);
- // this.showFlowChart(newVal);
- }
- },
- }