Vue中nextTick的理解

当你设置 vm.message = ‘new message’，该组件不会立即重新渲染。
因为vue更新DOM时，使用的是异步更新队列。目的是提高性能，避免无效的重复的DOM更新。即：vue 中更新数据后，并不会立即更新DOM，而是把数据引起的DOM更新放入到异步更新队列里。等待下次事 件循环（tick），并在两个tick之间进行UI渲染。 按照这个思路，程序员就不能在更改数据后，立即获取更新后的DOM，也不知道什么时候DOM能够 更新。基于此，vue提供了nextTick函数。
程序员只需要把 ”操作更新后DOM的代码“ 放入到$nextTick 的回调函数里。由nextTick内部，在更新完DOM后，调用回调函数Vue.nextTick(callback)。这样回调函数将在 DOM 更新完成后被调用。例如：

<div id="app">{{ message }}</div>
var vm = new Vue({
    el: '#app',
    data: {
        message: 'old message'
    }
})
vm.message = 'new message' // 更改数据
vm.$el.textContent //  旧的数据'old message'
Vue.nextTick(function () {
    vm.$el.textContent // 新的数据 'new message'
})