问题:在vue中v-for时需要添加key 这个key 需要"唯一",针对的是在不在同一层DOM节点上key唯一
错误写法:
<task-item
v-for="(ele, eleInd) in item.result"
:item="ele"
:key="eleInd"
v-show="status == 1"
:currentTab="currentTab"
>
<div class="examine" v-show="currentTab == 0" @click="goDetail(ele)">审核</div>
<div class="look" v-show="currentTab != 0" @click="goDetail(ele)">查看</div>
</task-item>
<store-item
v-for="(ele, eleIndx) in item.result"
:item="ele"
:key="eleIndx"
v-show="status == 0"
:type="type"
@click="goDetail(ele)"
>
</store-item>
看似没错 已经添加了key 但是控制
台爆红了:
原因:这里同时有两个for循环 在同一dom节点上
解决办法 根据定义 让循环不在同一dom节点上,添加标签
```javascript
<div>
<task-item
v-for="(ele, eleInd) in item.result"
:item="ele"
:key="eleInd"
v-show="status == 1"
:currentTab="currentTab"
>
<div class="examine" v-show="currentTab == 0" @click="goDetail(ele)">审核</div>
<div class="look" v-show="currentTab != 0" @click="goDetail(ele)">查看</div>
</task-item>
</div>
<!-- 门店相关 -->
<div>
<store-item
v-for="(ele, eleIndx) in item.result"
:item="ele"
:key="eleIndx"
v-show="status == 0"
:type="type"
@click="goDetail(ele)"
></store-item>
</div>