key——类型:Number/String
1,作用:
保证唯一性,防止重复渲染,导致的额外性能开销
作为唯一标识节点加速虚拟DOM渲染
2,最常见的用例是结合 v-for:
<ul>
<li v-for="item in items" :key="item.id">...</li>
</ul>
注:有相同父元素的子元素必须有独特的 key。重复的 key 会造成渲染错误。
例1——相同父级使用index出现报错信息
<div class="page">
<div class="oneSection">
<el-button
v-for="(item, index) in displayData"
size="medium"
:key="index"
>{
{ item.name }}
</el-button>
<el-button
v-for="(item, index) in displayData"
size="medium"
:key="index"
>{
{ item.name }}
</el-button>
</div>
<