前幾篇文章講了元件建立過程，當元件的資料發生改變時，會觸發元件的重新渲染，這時就是元件的更新過程。照樣會走到 patch 過程，但進入的邏輯跟元件建立的邏輯肯定是不同的，整個過程的核心就是判斷新舊元件 vnode diff 的過程，對新舊節點相同和不同的情況（通過 samevnode 方法來判斷），分別作不同的處理。
新舊節點不同的更新流程：建立節點 => 更新父佔位符節點 => 刪除舊節點
新舊節點相同的更新流程是去獲取它們的 children，根據不同情況作不同的更新邏輯：
為了更全面的展示 patchvnode （patchvnode 的作用就是把新的 vnode patch 到 舊的 vnode 上，）的邏輯，**的邏輯如下：
如果 vnode 是文字節點，且新舊文字節點不同，就替換內容。如果 vnode 不是文字節點就有四種情況需要處理：
如果新舊節點都有子節點，並不相同，就執行 updatechildren 函式；updatechildren 是乙個 diff 演算法，將整個 dom 樹對比一篇，對不同的情況進行最優解，並且會遞迴執行 patchvnode 方法，這個鏈結中講解了 updatechildren 的某一種情況的邏輯：如果只有新節點有子節點，但舊的是文字節點，就將舊的文字節點設定且空，並且將新節點插入；
如果只有舊節點有子節點，將舊節點全部刪除；
如果新舊節點都沒有子節點，而舊節點是文字節點，將文字節點設定為空。
我們也可以通過自己畫圖來走一篇 updatechildren 的其他情況，這種通過移動 dom 的方式比簡單的刪除 dom 的方式效能要高。
以上就是元件更新的大致內容。
vue重新渲染元件（重置或者更新）
方案一 v if 可以重置生命週期 當資料變更後,通過watch 監聽，先去銷毀當前的元件，然後再重現渲染。使用 v if 可以解決這個問題 refresh template export default watch script 這種方式雖然可以實現，但太不優雅 方案二 key 此處可觸發watc...
vue更新data值，如何重新渲染元件？
一 先介紹一下vue.set 方法 注 如果從服務端返回的資料量較少，或者只有幾個字段，可以用vue的set方法，如果資料量較大，請直接看第二種情況。官網api是這樣介紹的 vue.set target,key,value 引數 target keyvalue 返回值 設定完後的新值 用法 向響應式...
強制 Vue 重新渲染元件
有時候，依賴 vue 響應方式來更新資料是不夠的，相反，我們需要手動重新渲染元件來更新資料。或者，我們可能只想拋開當前的dom，重新開始。那麼，如何讓vue以正確的方式重新呈現元件呢？強制 vue 重新渲染元件的最佳方法是在元件上設定 key。當我們需要重新渲染元件時，只需更 key 的值，vue ...