事實上，在react中進行列表渲染時，不僅需要vue，還需要為每個組件添加key的屬性。
為了解釋key的作用，我們必須首先介紹虛擬DOM的Diff算法。
我們知道，vue和react都實現了壹組虛擬DOM，這使我們能夠在不直接操作DOM元素而只操作數據的情況下重新呈現頁面。其背後的原理是其高效的Diff算法。
1.兩個相同的組件產生相似的DOM結構，不同的組件產生不同的DOM結構。
2.同壹級別的壹組節點，可以用唯壹的id來區分。
基於這兩個假設，虛擬DOM的Diff算法的復雜度從O（n ^ 3）降低到O（n）。
這裏我們借用React的diff算法中的壹張圖來簡單解釋壹下:
* *如果節點類型不同，則直接殺死上壹個節點，然後創建並插入壹個新節點，並且不會比較該節點的後續子節點。
* *如果節點類型相同，節點的屬性將被重置，從而更新節點。
例如，考慮這種情況:
我們希望可以在b和c之間添加壹個f，默認情況下Diff算法執行如下:
更新C到F，D到C，E到D，最後插入E是不是效率很低？
因此，我們需要使用密鑰對每個節點進行唯壹標識，Diff算法可以正確識別該節點並找到正確的位置區域以插入新節點。
否則vue只會替換其內部屬性而不會觸發過渡效果。