Vue列表渲染v-for中index作為key的問題

本文轉載自查看原文 2021-10-21 13:10 919 vue

如下圖：

若用Index作為key，當數據更新時，虛擬DOM重新進行對比(diff):

首先,key為0時，文本節點出現不一致,所以要生成一個新的真實DOM

其次，對比input節點，因為虛擬DOM沒有value屬性，所以input節點是一樣的，直接復用

以此類推，就會出現節點錯位問題

且因為Key的變化，導致所有的文本節點都要重新渲染

本站轉載的文章為個人學習借鑒使用，本站對版權不負任何法律責任。如果侵犯了您的隱私權益，請聯系本站郵箱yoyou2525@163.com刪除。

猜您在找 Vue學習-vue中v-for為何要加key？index為何不推薦作為key 列表渲染v-for vue v-for 中的key屬性 v-for為什么要加key，能用index作為key么 Vue v-for嵌套數據渲染問題 Vue中v-for key的使用注意事項 Vue的v-for中列表項拖拽排序詳細方法 VUE中v-for和v-if不能同時使用的問題 vue v-for不重復渲染 vue項目中v-for渲染失敗