$nextTick的使用

vue在更新DOM时是异步执行的。当数据发生变化,vue将开启一个异步更新队列,视图需要等队列中所有数据变化完成之后,再统一进行更新。

有了nextTick机制,只需要更新一次视图,所有nextTick本质是一种优化策略

使用场景:

如果想要在修改数据之后立刻得到更新后的DOM结构,可以使用vue.nextTick()

在组件内实例方法只需要通过this.$nextTick(), 并且回调函数中的this将自动绑定到当前的vue实例上

 

this.message = ‘修改后的值‘
console.log(this.$el.textContent) // => ‘原始的值‘
this.$nextTick(()=> {
    console.log(this.$el.textContent) // => ‘修改后的值‘
})

$nextTick的使用

上一篇:计算机网络原理


下一篇:解决LicheePi zero启动ssh后系统无反应