【前端】解决Vue项目中遇到的错误Duplicate keys detected: ‘[object Object]‘. This may cause an update error.

// 报错
Avoid using non-primitive value as key, use string/number value instead.
Duplicate keys detected: ‘[object Object]’. This may cause an update error.

浏览器console出现上图所示警告，意思是检测到重复的键值。

<div v-for='(value) in data' :key='value'>

只需将:key的值改为下面两种情况之一就可以了。

<div v-for='(value) in data' :key='value.index'>

或

<div v-for='(value,index) in data' :key='index'>