슬라이드로 만들고 싶으면? react-multi-carousel

https://www.npmjs.com/pack

react-multi-carousel

---

슬라이드 만들기 

0

 

 

npm

npm install react-multi-carousel --save

import ( 내가 만들 슬라이스 파일에)

import Carousel from 'react-multi-carousel';
import 'react-multi-carousel/lib/styles.css';

Minimum working set up. 을 이용해서 만들어보기 

import React from 'react'
import Carousel from 'react-multi-carousel';
import 'react-multi-carousel/lib/styles.css';
const responsive = {
  superLargeDesktop: {
    // the naming can be any, depends on you.
    breakpoint: { max: 4000, min: 3000 },
    items: 5
  },
  desktop: {
    breakpoint: { max: 3000, min: 1024 },
    items: 3
  },
  tablet: {
    breakpoint: { max: 1024, min: 464 },
    items: 2
  },
  mobile: {
    breakpoint: { max: 464, min: 0 },
    items: 1
  }
};
const MoviSlide = ({movies}) => {
  return (
    <div>
      <Carousel responsive={responsive}>
  <div>Item 1</div>
  <div>Item 2</div>
  <div>Item 3</div>
  <div>Item 4</div>
</Carousel>;
    </div>
  )
}

export default MoviSlide

결과 창