CODEWITHSUNDEEP
vuejs2duplicateskeyv-for
Dusan
Dusan

Reputation: 145

Vue js [Vue warn]: Duplicate keys detected:

Hello I know what is the problem but I don't know how to solve it. Please help.

I am generating input fields and text area fields, so I have 2 v-fors(I will and third one too)

<div v-for="(textarea, textareaId) in blog.textareas" :key="textareaId">
<div v-for="(sectionTitle, sectionTId) in blog.sectionTitles" :key="sectionTId">

blog:{
            blogTitle: '',
            images: [
                {
                    imagesId: 0,//this was called id
                    name: ''
                }

            ],
            sectionTitles:[
                {
                    sectionTId: 0,//this was called id
                    title: ''    
                },
                
            ],
            textareas: [
                {
                    textareaId:0, //this was called id
                    text: ''
                },

            ]

        },

I have tried to change ids to not be all three 0 but I keep getting a warning evert time I enter the same number to :key="id"

Duplicate keys detected: '1'
Duplicate keys detected: '2'

and so on.

Upvotes: 0

Views: 684

Answers (1)

Vasile Radeanu
Vasile Radeanu

Reputation: 906

:key="'textarea_'+textareaId" and for sectionTitles :key="'section_'+sectionTId"

Upvotes: 2

Related Questions