Duplicate keys detected: '0'. This may cause an update error.

最新推荐文章于 2025-09-12 13:47:07 发布

原创最新推荐文章于 2025-09-12 13:47:07 发布 · 10w+ 阅读

41 ·

CC 4.0 BY-SA版权

vue 专栏收录该内容

64 篇文章

订阅专栏

本文解决了Vue中因模板内存在两个相同v-for指令导致的问题，通过修改其中一个v-for的key属性来避免冲突，确保了组件的正确渲染。

错误原因

一个template中有两个一样的v-for

<div class="info" v-for="(item, index) in currentFriend.content" :key="index">
    <div class="d1">
            <p v-text="item.time" class="timeBox"></p>
    </div>
</div>
<div class="info2" v-for="(item, index) in currentFriend.content" :key="'index">
    <div class="d2">
          <p v-text="item.time" class="timeBox"></p>
      </div>
</div>

解决办法

将其中以个的key修改一下

<div class="info2" v-for="(item, index) in currentFriend.content" :key="'info2-'+index">
    <div class="d2">
          <p v-text="item.time" class="timeBox"></p>
      </div>
</div>

参考文章