vue的watch监听属性中的immediate属性和deep属性

在我们的项目中,加深了对watch监听的理解和使用。

在以前对使用watch时只使用了handler()方法的使用,新数据和老数据的一个监听。

现在需要是页面刚进入就要以初始值执行handler函数

这时我们就需要使用immediate属性

将immediate设置为true的时候,就可以以初始值执行handler函数了

'attributeForm.numRule': {
     immediate: true,
     handler (val) {
        this.constantFill = val.indexOf(1) !== -1
        this.naturalFill = val.indexOf(3) !== -1
     }
 }

而对deep属性使用的频率可能会更少一些,

deep是确认是否进行深度监听,如果只监听这个对象,是监听不到对象里面值的变化

attributeForm: {
    uuid: null,
    dataType: 1,
    colnumName: ''
}
attributeForm: {
    immediate: true,
    handler (val) {
        this.constantFill = val.indexOf(1) !== -1
        this.naturalFill = val.indexOf(3) !== -1
    }
}

这样监听的话是监听不到uuid的变化,

这时想监听到uuid的变化需要将deep属性设置为true

你可能感兴趣的:(watch监听,vue.js,前端,javascript)