vue里v-for下的key的作用


將v-for的元素賦予唯一的key屬性,則會打破‘就地復用原則’;

這個就地復用原則是指 如果數據項的順序被改變,Vue 將不會移動 DOM 元素來匹配數據項的順序, 而是簡單復用此處每個元素,並且確保它在特定索引下顯示已被渲染過的每個元素

比如 <li v-for='item in persons' > {{item.id}} {{item.name}} <input type="text"></li>當persons數據變化后,比如persons數據reverse(),input不會隨着persons的渲染而發生改變
但是如果帶上key
<li v-for='item in persons' v-bind:key='item.id'> {{item.id}} {{item.name}} <input type="text"></li>,input就會隨着persons的變化而變化


免責聲明!

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



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM