Do not use v-for index as key on

// An highlighted block
<template>
  <div class="text">
    <transition-group tag="ul" :name="scrollType">
      <li
        v-for="(item, index) in dataList"
        :key="index"
        v-show="index == count"
      >
        <!-- <router-link to=""> -->
        <p>{{ univermsg(item) }}</p>
        <!-- </router-link> -->
      </li>
    </transition-group>
  </div>
</template>

vue代码如上,虽然vue项目运行正常,但报了如图在这里插入图片描述的警告。
在v-for 的时候大家都知道 要加上 :key 否则会有很多意想不到的报错。
但在这里的还是报错 ·这里的key里的index跟其他地方发生了冲突,·违背了key的·唯一性
解决方法 index换成别的indx

修改后

// An highlighted block
<template>
  <div class="text">
    <transition-group tag="ul" :name="scrollType">
      <li
        v-for="(item, indx) in dataList"
        :key="indx"
        v-show="indx== count"
      >
        <!-- <router-link to=""> -->
        <p>{{ univermsg(item) }}</p>
        <!-- </router-link> -->
      </li>
    </transition-group>
  </div>
</template>

然后重新运行
在这里插入图片描述
成功解决!希·望对大家有帮助


版权声明:本文为Leogentle原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明。