Блог

У меня есть такой список:

 data:{
        slides:[
            { slideImg: "images/necklace.webp"},
            { slideImg: "images/necklace2.webp"},
            { slideImg: "images/pants.webp"},
            { slideImg: "images/pants2.jpeg"},    
        ],    
    }
 

Я пытаюсь с помощью v-for:

 <div class="slide" v-for="slide in slides">
   <img :src="slide.slideImg">       
</div>
 

V-for отображает все элементы. Но у меня есть список опций, пример: когда я нажимаю опцию «1 на страницу», тогда будет показан 1 слайд, «2 на страницу», затем будут показаны 2 слайда, затем 3, 4, 5… Может кто-нибудь показать мне, как это сделать?

Лучше всего создать вычисляемое значение, которое фильтрует элементы, которые вы хотите показать.

 computed: {
  itemsToShow() {
    return this.items.slice(0, this.itemsToShowCount);
  }
}
 

затем используйте v-for для этого вычисляемого элемента.