I have only one slide and its replicate the inner content three times

[Ayan-Amir]

here is settings:
const settings = { dots: true, infinite: true, speed: 500, slidesToShow: 1, slidesToScroll: 1, };
and slider code:
<Slider {...settings}> <div> <h3>1</h3> </div> </Slider>

Output:

[channing-magiceden]

I think it's the same issue as #2337

[VigilioYonatan]

any update aboyt this issue??

[dheroying]

in version 0.30.2, it's still the same.
Still no update for this?

[dheroying]

I've switched to using another library.
Please use this: https://github.com/davidjerleke/embla-carousel

[rcolepeterson]

me too. have the problem. X 3
I fixed by setting infinite to false.
infinite: false

[VigilioYonatan]

adaptiveHeight: true is alternative bug

[ShilkovKonst]

I think it's the same issue as #2337

No, it's not the same issue.

me too. have the problem. X 3 I fixed by setting infinite to false. infinite: false

Yes, it fixes the problem. To avoid this strange behavior use a dynamic condition in "infinite" property:

const ImageSlider = ({ slides }) => {
  const settings = {
    infinite: slides.length > 1,
    // other setting's properties
  }
 return (
    <div className="slider-container px-8">
      <Slider {...settings}>
        {slides.map((slide, i) => (
          <div key={i}>
            {slide}
          </div>
        ))}
      </Slider>
    </div>