v-for中key的做用

key是dom節點的惟一標識，與內容相關聯

vue和react的虛擬DOM的Diff算法大體相同，其核心是基於兩個簡單的假設

首先講一下diff算法的處理方法，對操做先後的dom樹同一層的節點進行對比，一層一層對比，以下圖：

當某一層有不少相同的節點時，也就是列表節點時，Diff算法的更新過程默認狀況下也是遵循以上原則。

好比一下這個狀況：咱們要在A、B、C、D、E列表中B後面插入F

當key=index時，先後dom樹是這樣子的：

把C更新成F，D更新成C，E更新成D，最後再插入E，是否是很沒有效率？

因此咱們須要使用key來給每一個節點作一個惟一標識，Diff算法就能夠正確的識別此節點，找到正確的位置區插入新的節點。

key=index和key=id對比：

vue中列表循環需加:key="惟一標識" 惟一標識能夠是item裏面id index等，由於vue組件高度複用增長Key能夠標識組件的惟一性，爲了更好地區別各個組件 key的做用主要是爲了高效的更新虛擬DOM

參考：
https://www.jianshu.com/p/4bd...