React Bootstrap Carousel

부트스트랩도 있고 컴포넌트도 있음

컴포넌트로 하는 건 버전이 nodejs 버전이 안 맞아서인지 잘 안돼서

부트스트랩으로 ㄱㄱ

React Bootstrap Carousel 설치

npm i --save react-bootstrap-carousel

Carousel options

<Caroulsel
                        showThumbs={false}
                        showStatus={false}        
                        slide={false}
                        interval={null}
                        //onSlid={(key, direction)=>onSlid(key, direction)}
                        onSlide={(key, direction)=>onSlide(key, direction)}
                        onDrag={(e)=>onSlide(e)}
                        indicators={false}>

onSlide : slide start

onSlid : slide end

라고 하는데 onSlide에 파라미터인 direction으로 좌 end 우 start 로 받아와서 이거만 썼음
콜백함수 처리할 필요없이 슬라이드시 전, 후 이미지 로드됨
indicator={false} : 화살표 없애기
slide = {false} 로 지정해야지 autoplay 가 안됨

이 컴포넌트의 하위 컴포넌트로

<CarouselItem>
    <img src={m} key={index} alt={`slide`+index}/>
</CarouselItem>