Swiper.io запускается на последнем слайде в зависимости от того, где установлены данные - PullRequest
0 голосов
/ 08 ноября 2019

Я использую https://swiperjs.com/ и работаю с Vue Framework. Я объясню различные сценарии:

Сценарий 1 (выдает ошибку, нужно исправить это): я получаю отзывы по запросу GraphQL. Ответ используется для заполнения Swiper. Этот способ динамического добавления контента в swiper дает мне ошибку, когда ползунок начинается с последнего слайда.

Сценарий 2 (работает, но контент устанавливается вручную): я определил содержание отзывовв качестве переменной в моем разделе данных. Слайдер работает как надо. Установка данных вручную во всех жизненных циклах, кроме beforeCreate, работает без ошибок.

Это мой соответствующий код:

  getProductReviews(this.$apollo, { sku: 0 })
    .then(result => {
      // const temp = result.data.getBVReviews.reviews;
      // result.data.getBVReviews.reviews.push(temp[0]);
      // result.data.getBVReviews.reviews.push(temp[1]);
      this.getBVReviews = result.data.getBVReviews;
      if (this.isMounted) {
        this.setupReviewSlider();
      }
    })
    .catch(error => {
      console.log('Failed to load review data.');
      console.log(error);
    });

setupReviewSlider() {
      this.reviewSlider = new Swiper('.swiper-container', {
        slidesPerView: 'auto',
        initialSlide: 0,
        observer: true,
        observParents: true,
        navigation: {
          nextEl: '.swiper-button-next',
          prevEl: '.swiper-button-prev',
        },
      });
      // this.reviewSlider.on('reachEnd', () => {
      //   this.reviewSlider.slideTo(0, false,false);
      //   this.reviewSlider.autoplay = false;
      // })
    },

HTML-часть довольно большая, и это только смущает вас. Я сомневаюсь, что есть необходимость увидеть это, но если вы просто скажите мне.

Есть идеи?

...