[swiper] 스와이퍼 pagination 버그

스와이퍼 페이지네이션을 커스텀해서 슬라이드를 이동시키려 했으나,

내가 클릭한것이 아닌 다른 페이지가 active가 되는 현상을 발견했다.

해결 : 

  touchEventsTarget: 'wrapper'

이거 한줄 추가해주면 말끔히 해결된다!

var swiper = new Swiper('.swiper-container', {
  // loop:true,
  // autoHeight: true,
  effect: 'fade',
  touchEventsTarget: 'wrapper',
  pagination: true,
  hashNavigation: {
    replaceState: true,
    watchState: true
  },
  pagination: {
    el: '.swiper-pagination',
    clickable: true,
    renderBullet: function (index, className) {
      var paginationList = ['slide1', 'slide2', 'slide3', 'slide4']
      return '<span class="' + className + '">' + (paginationList[index]) + '</span>';
    }
  },
});

- 사용한 옵션 -