最近在项目中，用了v-for来动态添加组件，然后删除中间的组件时，删除掉的都是最后一个组件，插入顺序也很奇怪。
后来发现Vue用 v-for 更新已渲染过的元素列表时，它默认用“就地复用”策略。如果数据项的顺序被改变，Vue 将不会移动 DOM 元素来匹配数据项的顺序， 而是简单复用此处每个元素，并且确保它在特定索引下显示已被渲染过的每个元素。（其实,真正的原因是Virtual DOM 使用Diff算法实现）
也就是说他会根据key值去判断某个值是否修改,如果修改,则重新渲染这一项,否则复用之前的元素;所以不推荐index(即数组的下标)来作为key。
最近在项目中，用了v-for来动态添加组件，然后删除中间的组件时，删除掉的都是最后一个组件，插入顺序也很奇怪。 后...
使用vue的同学大家都知道，在使用v-for指令的时候，都需要添加一个key属性，并且是唯一的key。我们都会想到...
key vue官网推荐我们使用v-for时，给每一个节点元素添加一个唯一的 key，其实不只是vue，react中...
v-for中key的使用注意项v-for在循环时，key属性只能使用number获取stringkey在使用时只能...
Vue模板中使用v-for指令时不建议将index作为:key属性。今天我在看项目代码时，发现有多年开发经验的前端...
使用vue的时候 也就是v-for的时候出现了这个错误是因为:key="id" 这个id不是唯一性导致的，解决办法...
一.当v-for中key相同时，vue如何判断，如何渲染 如果不使用 key，Vue 会使用一种最大限度减少动态元...
官方推荐我们在使用v-for时，给对应的元素或组件添加上一个:key属性。这个其实和Vue的虚拟DOM的Diff算...
Vue 起步 Vue V-for循环 （一） Vue V-for 循环（二) Vue v-for表格
最近看了面试题中有一个这样的题，v-for 为什么要绑定 key？ Vue 中 key 很多人都弄不清楚有什么作用...
本文标题：【Vue】v-for要提供唯一key属性
本文链接：https://www.haomeiwen.com/subject/ixrhmqtx.html
网友评论