探索vue之旅————Vue.$nextTick()

最近学习vue的过程中遇到了nexttick（），在官方文档上没理解就查阅了一些资料，下面是我对vue.$nextTick()的一些理解。

  引用知乎上的例子：

//改变数据
vm.message = 'changed'

//想要立即使用更新后的DOM。这样不行，因为设置message后DOM还没有更新
console.log(vm.$el.textContent) // 并不会得到'changed'

//这样可以，nextTick里面的代码会在DOM更新后执行
Vue.nextTick(function(){
    console.log(vm.$el.textContent) //可以得到'changed'
})

要理解上面的首先要理解vue的响应式dom渲染，官方文档上是这样解释的：在下次 DOM 更新循环结束之后执行延迟回调。在修改数据之后立即使用这个方法，获取更新后的 DOM。

这就涉及到了一些异步执行，想更多理解异步请移步阮一峰大神，

vue渲染是先执行主线程的任务，主线程的任务执行完后执行任务队列中的函数即回调函数，vm.meassage在主线程上 修改后的数据会放在任务队列上，没涉及到dom的更新 ，当同步任务执行完毕后会执行回调函数把数据传递回来，然后在进行dom树更新，

vue.nextTtick()的作用就是在dom树更新后执行 也就是在修改数据之后立即使用这个方法，获取更新后的 DOM。