本文主要是介绍面试官:聊聊 nextTick,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!
前言
在最近的面试中,不少面试官叫我聊聊
nextTick
,nextTick
是个啥,这篇文章咱来好好聊聊!
我的回答
nextTick
是官方提供的一个异步方法,用于在 DOM 更新之后执行回调。正好在我的项目中用到了,就拿它来形容一下,大概的场景是渲染一个列表,每次点击按钮就会往列表后面添加十条数据,并立即跳到第十条数据的位置。我们知道渲染列表是需要耗时的,想要直接跳到第十条数据是行不通的,因为这时候数据并没有加载出来。这个时候就得进行异步操作,你可以添加一个定时器,但显然不太优雅,这时候 nextTick
就是最佳选择,它会在 DOM 更新完成后执行。
官方描述
参考官方文档
描述
等待下一次 DOM 更新刷新的工具方法。
当你在 Vue 中更改响应式状态时,最终的 DOM 更新并不是同步生效的,而是由 Vue 将它们缓存在一个队列中,直到下一个“tick”才一起执行。这样是为了确保每个组件无论发生多少状态改变,都仅执行一次更新。
nextTick()
可以在状态改变后立即使用,以等待 DOM 更新完成。你可以传递一个回调函数作为参数,或者 await 返回的 Promise。
示例
&
这篇关于面试官:聊聊 nextTick的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!