Vue中v-for为什么使⽤key?

我们需要使用key来给每个节点做一个唯一标识，Diff算法就可以正确的识别此节点，找到正确的位置区插入新的节点。

加key主要不是为了性能，主要是为了区分两个 vnode 节点。比如一个列表，增加其中一项，如果不加 key 区分，增加后新旧 vnode 对比就会出现 bug。因为列表元素 DOM 结构相同，vue 会把原本不相同的 vnode 认为是 sameVnode，导致 bug。

说到底，key的作用就是更新组件时判断两个节点是否相同。相同就复用，不相同就删除旧的创建新的。在渲染简单的无状态组件时，如果不添加key组件默认都是就地复用，不会删除添加节点，只是改变列表项中的文本值，要知道节点操作是十分耗费性能的。而添加了key之后，当对比内容不一致时，就会认为是两个节点，会先删除掉旧节点，然后添加新节点。