[Vuejs]-Vue 3 make same multiple cards with different contents

by

0👍

✅

That’s because you are looping all the images, tags, etc individually. As you said you want the whole element to be multiplied in your comments, that’s what you need to do, loop the whole card.

<div>
   <!-- I want this whole element below to be multiplied -->
   <div class="col-md-4" v-for="(project,id) in projectList" v- 
       bind:key="project.id" >
        <div class="card card--project">
       <img class="card__img" " :src="project.img" alt="" />
       <div class="card__text">
        <p class="project-label text-md text-md--md" >{{ project.tag }}</p>
        <h4 class="text-gradient-primary">{{ project.name }}</h4>
        <p class="project-desc text-md" >{{ project.desc }}</p>
        <a href="#" class="links">Read More</a>
      </div>
    </div>
  </div>
</div>

Leave a comment