08月16日,2022

vue关闭修复报错Duplicate keys detected: '0'. This may cause an update error.(错误,检测到重复的key值:”0“,这可能会导致更新错误)

今天再写企业用户统计数字和机构统计数字需要单独显示,返回通过v-for分别实现了ui需要效果

 <span v-for="(item,index) in userNumber" :key="index" class="number">{{ item }}</span>家企业,
<span v-for="(item,index) in entiyNUmber" :key="index" class="number">{{ item }}</span>家服务机构入驻平台

。但是运行报错Duplicate keys detected: '0'. This may cause an update error.(错误,检测到重复的key值:”0“,这可能会导致更新错误),程序上线时,都需要关闭控制台的打印和错误,虽然不影响交互和功能。特此记录之修复处理。

错误原因:

在使用v-for的时候,我们都要必须加上一个唯一的key值,但是这里写了两个for循环,尽管都加上了key值,但是key值都是0,1,2等如此的数字,所以就导致了警告。

解决办法:

<span v-for="(item,index) in userNumber" :key="'u-'+index" class="number">{{ item }}</span>家企业,
<span v-for="(item,index) in entiyNUmber" :key="'e-'+index" class="number">{{ item }}</span>家服务机构入驻平台
修改其中一个或者通过字符串拼接成不一样的

本文链接:https://www.liaonian.com.cn/info_42.html

-- EOF --