Vue中nextTick()的使用

nextTick

在下次 DOM 更新循环结束之后执行延迟回调。在修改数据之后立即使用这个方法,获取更新后的 DOM

使用场景:


1.

如果在beforeCreated,created钩子函数中操作dom节点的话,就要使用this.$nextTick(),否则会报错。

beforeCreate(){

this.$nextTick(()=>{

this.$refs.p.color="blue";

})

}

2.v-if后操作节点

我在这

data:{

show:false

},

methods:{

change(){

this.show=!this.show

if(this.show){

this.$nextTick(()=>{    //不写会报Cannot read property 'style' of undefined

this.$refs.dom.style.color="red";  

})

}

}

你可能感兴趣的:(Vue中nextTick()的使用)