Vue中的$nextTick怎么理解？

一、NextTick是什么

官方对其的定义

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

什么意思呢？

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

举例一下
Html 结构

<div id="app">{
  {message}}</div>

构建一个 vue 实例

const vm = new Vue({
	el:"#app",
	data:{
		message:"原始值"
	}
})

修改message

this.message = '修改后的值1'
this.message = '修改后的值2'
this.message = '修改后的值3'

这时后想获取页面最新的DOM节点，却发现获取到的是旧值

console.log(vm.$el.textContent)

这是因为message数据再发现变化的时候，vue并不会立刻去更新Dom,而是将修改数据的操作放在了一个异步操做队列中

如果我们一直修改相同数据，