vue 中 key 的作用是追蹤列表元素的唯一身份，以優化更新性能和確保正確刪除。原理是通過在虛擬 dom 節點中使用 key 作為標識符，比較新舊 key 來僅更新發生更改的元素，或刪除帶有不同 key 的元素。最佳實踐包括：為每個元素指定唯一 key，使用穩定的值（例如 id），避免使用索引。
Vue 中 key 的作用和原理
在 Vue.js 中，key 屬性用于跟蹤組件列表中的元素的唯一身份。它是一個重要的屬性，有助于 Vue 優化渲染性能，并確保組件的正確更新和刪除。
作用
key 的主要作用有：
追蹤元素身份： key 允許 Vue 識別列表中的每個元素，即使元素的內容相同。
優化更新： 當列表更新時，Vue 會比較新舊 key，從而只更新發生更改的元素。這可以提高渲染性能，尤其是當列表很大時。
刪除元素： 當從列表中刪除元素時，Vue 使用 key 來識別要刪除的元素，確保正確刪除。
原理
key 實際上是一個屬性，可以賦予列表中每個元素。它是虛擬 DOM 中元素的唯一標識符。當 Vue 渲染列表時，它會為每個元素創建唯一的虛擬 DOM 節點，并將 key 作為屬性添加到該節點。
當列表更新時，Vue 會比較新舊 key。如果 key 相同，則 Vue 會復用舊的虛擬 DOM 節點，只更新必要的數據。如果 key 不同，則 Vue 會創建一個新的虛擬 DOM 節點。
最佳實踐
使用 key 時，有以下最佳實踐：
為列表中的每個元素指定一個唯一的 key。
使用穩定且不會隨著時間而變化的值，例如 ID 或唯一標識符。
避免使用索引作為 key，因為當列表重新排序時，索引可能會發生變化。
