this.$nextTick与Vue.nextTick

**this.$nextTick()**官方介绍：将回调延迟到下次 DOM 更新循环之后执行。为了在数据变化之后等待 Vue 完成更新 DOM （可以在数据变化之后立即使用 ，得到的就是更新后的数据）。它跟全局方法 Vue.nextTick 一样，不同的是回调的 this 自动绑定到调用它的实例上。
一个修改官方的例子讲的很明白：

<div class="app"><div ref="msgDiv">{
   {msg}}</div><div v-if="msg1">Message got outside $nextTick: {
   {msg1}}</div><div v-if="msg2">Message got inside $nextTick: {
   {msg2}}</div><button @click="changeMsg"> Change the Message</button>
</div>
</body>
<script>new Vue({el: '.app',data: {msg: 'Hello Vue.', msg1: '', msg2: ''},methods: {changeMsg () {this.msg = "Hello world.";this.msg1 = this.$refs.msgDiv.innerHTML;       //hello.vue 这里数据改变了，却没有渲染DOMthis.$nextTick(() => {this.msg2 = this.$refs.msgDiv.innerHTML      //hello.world  正确的输出});}           //第一次点击是上面的输出，再次点击全部为hello.world}})
</script>