一：是什么

在进行vue项目编写时，会遇到v-for进行循环遍历，但是打开控制台，报警告提示，

"[Vue warn]: Duplicate keys detected: '0'. This may cause an update error." 

使用 v-for 指令时，它需要每个列表项都有一个唯一的 key 值，以便能够高效地更新和重用 DOM 元素

如果列表中至少有两个元素使用了相同的 key 值。会导致 Vue 无法正确追踪这些元素的状态，可能会引起更新错误或不可预测的行为

二：解决方案

1：确保key唯一性

<div v-for="item in items" :key="item.id">
  {{ item.name }}
</div>

2：检查数据源,是否出现相同的key,或者相同id导致

  ContractPriceDetailsModeDataSource:[
            {id:1,key:0,name:'首期款',amount:''},
            {id:1,key:1,name:'二期款',amount:''},
            {id:3,key:2,name:'三期款',amount:''},
            {id:4,key:3,name:'四期款',amount:''},
            {id:5,key:4,name:'五期款',amount:''},
        ],

3：使用索引备选

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

三：总结

1：保持v-for循环遍历key的唯一性