Vue中的nextTick

DOM的改变,会触发事件。事件是同步执行的。

数据的更新,不会立刻触发视图的更新。在Vue中,DOM的变动是异步的。

 

如果想要得到数据更新后的dom对象,并执行操作。初始化时可以写在mounted中,此外可以写在nextTick这个api中。

Vue.nextTick(callback,执行上下文环境的this) --接收两个参数

 

Vue.nextTick里面有三个重要变量:callback(回调) pending(是否正在执行回调) timefunc(触发回调的函数)

 

将触发方式传给timefunc的三种实现:Promise MutationObserver(h5的api 监视dom的变化 回调可异步更新视图) 

setTimeout(fn,0)

 

实例:

 
{{msg}}
Message got outside $nextTick: {{msg1}}
Message got inside $nextTick: {{msg2}}
Message got outside $nextTick: {{msg3}}

你可能感兴趣的:(vue,前端)