mastermindlegion
1 month ago
137
1
Vue

Nested v-for loop

Posted 1 month ago by mastermindlegion

Hello friends, I got problem-related to the v-for loop. I'm trying to loop over multiple objects/arrays using v-for. It successfully loops over but renders multiple numbers of empty div above. My page:

     <template v-else>
            <div class="">
                <h1>{{advertisementsCategory.name}}</h1>
                <template v-for='advertisements in advertisementsCategory' >

                     <advertisements-block v-for='advertisement in advertisements' :advertisement='advertisement' :key='advertisement.id' />

                </template>
            </div>
         </template>

than passing prop to the component:

<div class=" bg-white flex">
       <div class="" >

           {{ advertisement.name  }}
        </div>

       </div>

Result is xxxx empty divs:

</div></div>

Thanks for any suggestions

Please sign in or create an account to participate in this conversation.