前言
在最近的面试中,不少面试官叫我聊聊
nextTick
,nextTick
是个啥,这篇文章咱来好好聊聊!
我的回答
nextTick
是官方提供的一个异步方法,用于在 DOM 更新之后执行回调。正好在我的项目中用到了,就拿它来形容一下,大概的场景是渲染一个列表,每次点击按钮就会往列表后面添加十条数据,并立即跳到第十条数据的位置。我们知道渲染列表是需要耗时的,想要直接跳到第十条数据是行不通的,因为这时候数据并没有加载出来。这个时候就得进行异步操作,你可以添加一个定时器,但显然不太优雅,这时候 nextTick
就是最佳选择,它会在 DOM 更新完成后执行。
官方描述
参考官方文档
描述
等待下一次 DOM 更新刷新的工具方法。
当你在 Vue 中更改响应式状态时,最终的 DOM 更新并不是同步生效的,而是由 Vue 将它们缓存在一个队列中