반응 슬릭에서 회전 목마 항목의 반복을 피하는 방법

Question

나는 반응 슬릭을 사용하고 있습니다. 한 번에 네 가지 항목을 보여주고 싶습니다. 데이터를 동적으로 표시하고 있습니다.

캐 러셀에 하나의 항목이있는 경우 4 개의 항목을 채울 때 반복됩니다.

const settings = { 
    dots: false, 
    infinite: true, 
    speed: 500, 
    slidesToShow: 4, 
    slidesToScroll: 1, 
}; 

<Slider {...settings}> 
    //mapping data 
</Slider> 

당신이

Answer 1

그것은 infinite이 true으로 제공되기 때문에 모든 4 곳을 채우기 위해 반복 감사합니다

이

내 코드입니다. 따라서 네 가지 항목을 찾으려고 시도하지만 동일한 항목을 반복해서 찾는 것입니다. 원하는 동작 (양방향으로 무한히 스크롤)을 얻으려면 slidesToShow을 동적으로 설정하는 것이 좋습니다.

mapping data을 list이라고 가정하면 slidesToShow의 수를 동적으로 설정할 수 있습니다.

const settings = { 
dots: false, 
infinite: true, 
speed: 500, 
slidesToShow: list.length > 4 ? 4 : list.length, 
slidesToScroll: 1, 
}; 

<Slider {...settings}> 
    //mapping data 
</Slider>