swiper 는 loop 모드 에서 현재 색인 값 이 올 바 르 지 않 습 니 다.

1300 단어
1. swiper 는 loop 이 false 인 경우
현재 색인 값 가 져 오기:
this.active = this.activeIndex 

2. swiper 는 loop 이 true 인 상황 에서
this.active = $('.swiper-slide-active').attr('data-swiper-slide-index')

또는:
this.active = this.realIndex

3html 구조:

  
  
  

4、data数据结构:

active: 0,
swiperOption: {
  slidesPerView: 1,
  spaceBetween: 20,
  initialSlide: 0,
  loop: true,
  pagination: {
    el: '.swiper-pagination',
    clickable: true
  },
  navigation: {
    nextEl: '.swiper-button-next',
    prevEl: '.swiper-button-prev'
  },
  on: {
    slideChangeTransitionEnd() {
      this.active = $('.swiper-slide-active').attr('data-swiper-slide-index')
      console.log('loop:false  :', this.activeIndex)
      console.log('loop:true  1:', this.active)
      console.log('loop:true  2:', this.realIndex)
    }
  }
},

좋은 웹페이지 즐겨찾기