vue中的nextTick

一、什么是nextTick

   nextTick 是 Vue.js 中的一个全局 API，在JS的事件循环中它将回调函数放进微任务队列。DOM 的更新在同步任务队列清空后，且在微任务队列中的所有任务执行之前发生，这意味着在微任务队列中的dom是已更新的，所以nextTikc可以在dom更新后进行一些操作。

二、在什么时候用nextTick

1. 需要在DOM 更新后执行操作：Vue.js 异步执行 DOM 更新。这意味着当你修改了数据，DOM 不会立即更新，而是等到下一次事件循环。nextTick 允许你在 DOM 更新后立即执行某些操作。例如，你可能想在数据更改后获取新的 DOM 元素尺寸或位置。
2. 确保视图与数据同步：在某些情况下，你可能需要确保视图已经与底层数据完全同步。使用 nextTick 可以确保在继续执行代码之前，DOM 已经根据最新的数据进行了更新。

三、VUE2与VUE3中使用nextTick

vue2:

this.$nextTick(function () {  
  // DOM 现在已经更新  
})

vue3:

import { nextTick } from 'vue'  
  
nextTick(() => {  
  // DOM 现在已经更新  
})