Vue.js - повторяющиеся ключи с использованием v-for в AccordionTab (Primevue)

Я пытаюсь создать 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.

1 ответ

Кажется, у вас есть два или больше cursos с тем же descripcion который вызывает эту проблему, поэтому попробуйте использовать index как ключ вроде:

<AccordionTab v-for="(curso,index) in cursos.curso" :key="index" :header="curso.descripcion">
    {{ curso.descripcion }}
  </AccordionTab>
Другие вопросы по тегам