Vue 报错:Duplicate keys detected: '[object Object]'. This may cause an update error.

在vue 组件中使用 v-for,并且加了key 值。如果key 值不唯一,就会出现这样的错误。

<swiper-item v-for="item in banners" :key="item">
	<a :href="item.link">
		<img :src="item.image" alt="">
	</a>
</swiper-item>

仔细观察控制台,其实还有一个报错:

Avoid using non-primitive value as key, use string/number value instead.

报错信息中给出了解决方案:使用字符串或者数字值做为key 值

<swiper-item v-for="item in banners" :key="item.index">
	<a :href="item.link">
		<img :src="item.image" alt="">
	</a>
</swiper-item>
Logo

华为开发者空间,是为全球开发者打造的专属开发空间,汇聚了华为优质开发资源及工具,致力于让每一位开发者拥有一台云主机,基于华为根生态开发、创新。

更多推荐