Vue中nexttick

是什么？

官方的定义：

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

用法：

接收一个回调函数作为参数，作用是将回调函数延迟到下一次dom更新完毕后使用。如果没有传入回调函数，并且在支持的环境中，会返回一个对象

使用场景：

在对数据进行赋值之后，需要对新dom做一些操作的时刻，但是此刻最新的dom还没有进行更新。

为什么数据赋值后，不会立马更新dom

原因：

vue 更新dom是异步执行的。监听到数据变化，vue会开启一个事件队列，缓冲在同一事件循环中的发生的所有数据变更。如果一个多次被触发，会只推入事件队列一次。在下一个事件循环中，vue刷新队列并执行实际（已去重的工作）

优点：

便于去重和无意义的dom操作（重复赋值，重复触发），提高效率

实现：

vue内部对异步队列会会用.then ， 和来执行，如果执行环境不支持会采用来代替

的实现（vue2）

1.基本原理

2.事件循环

3.源码解析

的实现（vue3）

更新dom也是异步任务，那怎么保证他们的执行顺序呢？

总结

总的来说，vue2和vue3的原理还是十分相像的，都是创建异步队列，添加到微任务队列中去。

vue3 减少了异步队列的创建以及环境的判断，直接使用.then添加到微任务队列中，但是在更新响应式数据的dom时，仍然保留了vue2的模式。

更新dom和回调都是将任务添加到dom中去，只是更新dom会在回调更前添加到dom中，故可以可以获取到最新dom。