Vue中列表渲染指令中key属性的理解

在官网中看到v-for指令中key这一块时，对其感觉懵懵懂懂，查阅了一些资料，把自己的理解记录下来，做一个心得，不知道理解的对不对，希望有大牛指导。

参考链接：https://segmentfault.com/a/1190000013810844

Vue在更新v-for指令渲染过的HTML时，采用的是就地复用策略，也就是已有的HTML元素不在重新渲染，直接更新部分数据，这对简单的HTML来说没有影响，因为最终的展示效果同代码写出来的一样，但是如果使用复杂的模板组件时，如模板元素都一样，但是对每个模板都有一个操作按钮操作当前数据信息，没有绑定key元素的话，就区分不出每个元素的唯一性。

回过头来再看自己之前的理解发现有偏差，原来key的作用是用来标识就地复用的DOM结构的唯一性。已经渲染过的DOM元素相当于给它一个唯一属性key，如果新增加的DOM元素的唯一属性key值已存在，就会复用之前的DOM元素。