Bootstrap

watch中的immediate、handler和deep属性

1、immediate属性

使用watch时有一个特点,就是当值第一次绑定时,不会执行监听函数,只有值发生改变时才会执行。如果我们需要在最初绑定值的时候也执行函数,则就需要用到immediate属性。

2、handler属性

watch中需要具体执行的方法

3、deep属性

data() {
    return {
        obj: {
            'name': "超级无敌暴龙战士",
            'age': 999
        },
    }
},
watch: {
    obj: {
        // 执行方法
        handler(oldValue,newVal) {
             console.log(oldValue)
             console.log(newValue)
        },
        deep: true, // 深度监听
        immediate: true  // 第一次改变就执行
    }
 
 
   // 如果只需要监听对象中的一个属性值,则可以做以下优化:使用字符串的形式监听对象属性:
    'obj.name': {
        // 执行方法
        handler(oldValue,newVal) {
             console.log(oldValue)
             console.log(newValue)
        },
        deep: true, // 深度监听
        immediate: true  // 第一次改变就执行
    }
 
 
 
}

;