Блог

Я пытаюсь работать со ionic слайдами, но не смог найти решение для обновления slidesPerView. Все, что я хочу,-это изменить поворот слайдов на экране или изменить ширину экрана.

Мой код:

 @ViewChild('mySlider')  slides: IonSlides;
slideOpts = {
    loop: false,
    slidesPerView: 3,
    slidesPerGroup: 6,
    grabCursor: true,
    spaceBetween: 1,
    observer:true,
    observeParents:true,
    observeSlideChilden:true
  };
@HostListener('window:resize', ['$event'])
  getScreenSize(event?) {
    this.scrHeight = window.innerHeight;
    this.scrWidth = window.innerWidth;
    this.screenSize = this.scrWidth/250;
    this.slideOpts.slidesPerView = this.screenSize;
    this.slides.update();
    console.log(this.scrHeight, this.scrWidth,this.screenSize,this.slideOpts.slidesPerView);
  }
 

решается путем добавления точек останова :

 breakpoints: {
        // when window width is >= 320px
        320: {
          slidesPerView: 2,
          spaceBetween: 20
        },
        // when window width is >= 480px
        480: {
          slidesPerView: 3,
          spaceBetween: 30
        },
        // when window width is >= 640px
        640: {
          slidesPerView: 6,
          spaceBetween: 40
        }
    }
  });