当前位置: 首页 > Web前端 > vue.js

为什么v-for要添加关键字段

时间:2023-03-31 21:42:45 vue.js

v-for渲染后,如果有新的变化,比如在数组中间添加了一个元素,此时会执行diff算法进行判断,并且两个数组之后,得到两个数组的长度,使用较短的长度进行遍历比较,在当前条件下以最高效的方式进行变化。此时如果元素不添加key字段,遍历效果图如下:看图可以发现匹配不同元素后,替换和添加开始浪费资源,再来看看添加key后的遍历过程。通过key的匹配,实现最大程度的复用:如有理解错误,欢迎指正!