$nextTick原理及运用

1.Vue.nextTick( [callback, context] )：在下次 DOM 更新循环结束之后执行延迟回调。在修改数据之后立即使用这个方法，获取更新后的 DOM。

2.为什么需要它呢?

Vue 是异步修改 DOM 的并且不鼓励开发者直接接触 DOM，但有时候业务需要必须对数据更改–刷新后的 DOM
做相应的处理，这时候就可以使用 Vue.nextTick(callback)这个api 了

解释：Vue是异步执行dom更新的，一旦观察到数据变化，Vue就会开启一个队列，然后把在同一个
事件循环 (event loop)当中观察到数据变化的 watcher 推送进这个队列。如果这个watcher被触发多次，
只会被推送到队列一次。这种缓冲行为可以有效的去掉重复数据造成的不必要的计算和DOm操作。
而在下一个事件循环时，Vue会清空队列，并进行必要的DOM更新。

3.理解原理前的准备
首先需要知道事件循环中宏任务和微任务这两个概念

1.常见的宏任务有：script, setTimeout, setInterval, setImmediate, I/O, UI rendering
2.常见的微任务有：process.nextTick(nodejs),Promise.then(), MutationObserver