v-for key的简单理解

<div v-for="(item,index) in list :key="index">{{item.name}}</div>

用index作为key  渲染的时候 会将index当做key值，这样就会出现 当插入一个数据的时候， 比如插入到了索引为1处，

那么插入的这个数据的索引就是1，key值也是1，而原本的1 就会依次移动，渲染，这样就浪费资源了

key=0  id=0 index=0 value=t0

key=1  id=1 index=1 value=t1

key=2  id=2 index=2 value=t2

 

用索引为key 插入一条数据

key=0  id=0 index=0 value=t0

key= 1 id=4 index=1 value=t4

key=2  id=1 index=2 value=t1

key=3  id=2 index=3 value=t2

 

如何解决 为每条数据添加一个唯一标识符 ID

ID是唯一的，当把ID作为key 渲染的时候 ID就是key值， 当插入一条数据的时候 插入的地方还是索引为1处，但是此处的key就是id 

key=0  id=0 index=0 value=t0

key= 4 id=4 index=1 value=t4

key=1  id=1 index=1 value=t1

key=2  id=2 index=2 value=t2