Frontend/React

[React Swiper] loop={true} 마지막 페이지 먼저보이는 에러

전예방 2023. 4. 13. 22:22

loop : 자동 순환되게 설정을 했는데 처음 페이지 진입하면 마지막 페이지 부터 보여줌

구글 검색해 봤는데... 약간 Swiper 에러 같음

가뜩이나 pagination을 fraction타입으로 설정해놔서 3/3 -> 1/3 이런식으로 작동한다.

 

<Swiper
	modules={[Pagination, A11y, Controller, Navigation, Autoplay]}
	pagination={{ type: 'fraction' }}
	loop={true}
	navigation={true}
	initialSlide={1} // 이거 선언해주면 된다
>

 

initialSlide={1} 이라고 선언하니까 정상작동함

 

api 문서 설명에는 Index number of initial slide. 이렇게 작성되어있어서 0이라고 작성했는데 작동을 안함

알고보니 마지막 페이지가 swiper-duplicate? 라고 class가 주어져있고 젤 상단에 있어서 그랬던 것이였음

 

그래서 그 바로 뒤 index인 1을 주니까 1페이지부터 잘보여줬다.

'Frontend/React'의 다른글

  • 현재글 [React Swiper] loop={true} 마지막 페이지 먼저보이는 에러

관련글