1

我正在尝试为数组的每个对象生成一个 AccordionTab（来自 Primevue 的组件）：

<Accordion>
  <AccordionTab v-for="curso in cursos.curso" :key="curso.descripcion" :header="curso.descripcion">
    {{ curso.descripcion }}
  </AccordionTab>
</Accordion>

它实际上似乎按预期工作，但浏览器控制台为数组中的每个对象显示如下警告：

[Vue 警告]：检测到重复键：“Primero”。这可能会导致更新错误。

我已经检查过并且数组v-for正在迭代，并且每个对象在指定为键的字段中都有不同的值，那么为什么它会给出警告呢？

编辑： 这是我的 Vue Devtools 控制台的屏幕截图，显示了我在组件中拥有的数据：

组件中的数据

如果我将代码更改为此，以索引为键：

<Accordion :multiple="true">
  <AccordionTab v-for="(curso, index) in cursos.curso" :key="index" :header="curso.descripcion">
    {{ curso.descripcion }}
    {{ index }}
  </AccordionTab>
</Accordion>

警告消失了，渲染的组件就是这个：

渲染

它再次表明数据实际上并没有重复，所以我仍然不知道警告来自哪里，也许它可能来自 Primevue 的组件实现。

4

1 回答 1

3

似乎您有两个或更多cursos相同的descripcion内容会产生此问题，因此请尝试将index用作键，例如：

<AccordionTab v-for="(curso,index) in cursos.curso" :key="index" :header="curso.descripcion">
    {{ curso.descripcion }}
  </AccordionTab>
于 2020-03-06T09:37:23.337 回答