Javascript [Vue warn]：检测到重复的密钥：'；10'；。这可能会导致更新错误

我一次又一次地尝试，但我不理解此错误：[Vue warn]：检测到重复的密钥：“10”。这可能会导致更新错误

我在下面尝试过，但错误发生在我的控制台中

1/我从JSON API获取资源，以获得用户列表和相册列表 2/然后我尝试将这些数组合并到一个数组中 3/尝试嵌套一个v-for循环，以便呈现一个用户列表，其中每个id包含每个用户的相册

---

我的应用程序：

{{u.name}
{{u.username}
{{u.email}
{{u.phone}}
{{u.website}


{{album.title}

从“axios”导入axios
导出默认值{
名称：'第页'，
数据（）{
返回{
usersInfos:[]，
用户列表：[]，
相册：[]，
搜索：“”，
}
},
安装的（）{
//请求用户列表
让merge=[]；
让usersList=[]；
让相册=[]；
axios.get（）https://jsonplaceholder.typicode.com/users')
。然后（响应=>{
this.usersList=response.data
usersList=this.usersList；
log（usersList，'usersList'）
merge.push（usersList）；
日志（合并，“第一次合并”）
})
.catch（（错误）=>{
console.log（错误）；
});
axios.get（）https://jsonplaceholder.typicode.com/users/1/albums')
.然后（responseAlbum=>{
this.albums=responseAlbum.data
albums=这个。albums；
日志（相册，“相册”）；
合并。推送（相册）；
console.log（合并，“第二次合并”）
})
.catch（（错误）=>{
console.log（错误）；
});
merge=this.usersInfos；
}
}

问题可能是重复，如果您尝试删除重复项，我认为这可能会奏效

使用以下代码删除重复项：

this.usersInfos = this.usersInfos.filter((value, index, self) => self.findIndex(m => m.id === value.id) === index)

---

问题可能是重复的，如果你试图删除重复的，我认为这可能会奏效

使用以下代码删除重复项：

this.usersInfos = this.usersInfos.filter((value, index, self) => self.findIndex(m => m.id === value.id) === index)

---

您很可能有多个相册具有相同的

userId

，因此

album.userId

作为

key

将导致该错误。感谢您评论我的问题！是的，确实如此，但我尝试了很多方法：album.id，或者将一个v-for父对象与usersInfos和两个v-for子对象放在一起，但这一次在控制台中不会出现错误。尝试将两个v-for中的一个键都输出到另一个li元素中，并查找重复项。您可以将整个.vue文件作为代码插入，而不必拆分它。您也不会丢失代码片段。您很可能有多个相册具有相同的

userId

，因此

album.userId

作为

key

将导致该错误。感谢您评论我的问题！是的，确实如此，但我尝试了很多方法：album.id，或者将一个v-for父对象与usersInfos和两个v-for子对象放在一起，但这一次在控制台中不会出现错误。尝试将两个v-for中的一个键都输出到另一个li元素中，并查找重复项。您可以将整个.vue文件作为代码插入，而不必拆分它。您也不会丢失代码片段。