Vue在渲染DOM時，因為考慮到效能問題，會先等待資料更新後，再重新渲染，這樣在使用勾子函式或是option API想取得DOM資訊時，會發現沒辦法及時取得資料。而面對這種情況，Vue提供全域方法nextTick()。

異步更新-nextTick

語法：

//在function中以this取得$nextTick方法
this.$nextTick((function){
	//執行DOM更新完後的動作
});

只要取得Vue實體，便可取得nextTick()方法。
（Vue實體舉例：

var app =Vue.createApp({
    data:function(){
         return {
            message:'Hello World'
         }
    },
});

)

範例：
目標：取得DOM更新後的高度

<div id="app">
     <button @click="list.push(list.length+1)">ADD</button>
     <ul ref="ullist">
         <li v-for="item in list">{{item}}</li>
     </ul>
</div>

<script>
   var app =Vue.createApp({
       data:function() {
          return {
              list:[]
          };
       },
                
       watch:{
          list:{
              handler:function(newList,oldList){
                 console.log('一般',this.$refs.ullist.offsetHeight);
                 this.$nextTick(function(){
                    console.log('nextTick',this.$refs.ullist.offsetHeight);
                 });
              },
              deep:true,
          }
        }
    });
    app.mount('#app');
</script>

執行結果：