[React Swiper] play, stop 버튼 만들기
·
Frontend/React
* 참고 문서 https://swiperjs.com/swiper-api#autoplay Swiper API Swiper is the most modern free mobile touch slider with hardware accelerated transitions and amazing native behavior. swiperjs.com Autoplay를 모듈에 작성해준다. - disableOnInteraction -> 내가 만약 임의로 페이지를 넘겼을 때 (기본값이 true) true : 자동 재생이 멈춤 (재생버튼이 있으면 재생버튼을 눌러줘야지 다시 autoplay가 된다) false : 내가 임의로 넘긴 페이지부터 자동재생이 계속된다. 자동 재생 버튼 컴포넌트 만들기 아래 stackoverflow..
[React Swiper] 리액트에서 스와이퍼 사용하기
·
Frontend/React
리액트에서 Swiper 모듈 사용하기 * 일단 Swiper를 npm install 했다는 전제하에 1. swiper를 import 해준다. import React, { useRef, useState } from 'react'; import { Swiper, SwiperSlide } from 'swiper/react'; import SwiperCore, { Autoplay, FreeMode, Pagination, Navigation, A11y, } from 'swiper'; 2. swiper 컴포넌트 사용하기 swiper props로 공식문서를 확인하면서 필요한 것을 추가하면된다. https://swiperjs.com/swiper-api Swiper API Swiper is the most modern f..