for根据ID去重_复习之与v-for指令离不开的 Key

为什么要使用key？

Vue使用v-for渲染的元素列表时，它默认使用“就地复用”的策略。如：

<

当在用户名输入数字的时候，

然后切换成为密码的时候，

发现切换成为密码框的时候，数字还存在。表示，Vue只是简单的复用了input元素，而没有取更换它。

这就是所谓的 ‘Vue 的就地复用策略’。

在"就地复用"策略中，input的框没有随着文本一起切换，是因为input输入框没有与数据绑定，所以vuejs默认使用已经渲染的input。然而，文本是与数据绑定的，所以文本被重新渲染。这种处理方式在vue中是默认的列表渲染策略，因为高效。

但是在更多的时候，我们并不需要这样去处理。所以，为了给Vue一个提示，以便它能跟踪每个节点的身份，从而重用和重新排序现有元素，我们需要为每项提供一个唯一key特性，Vue会基于 key 的变化重新排列元素顺序，并且会移除 key 不存在的元素。

key的使用方法

<

加上key之后，Vue就不会使用‘就地复用策略’了。

注意：不要使用索引值index做为key值。key不仅为v-for所有，它可以强制替换元素，而不是重复使用它。

那么key如何唯一的？

跟后台协作时，传回来的每一条数据都有一个id值，这个id就是唯一的，用id做key即可。