In infinite mode, when slidesToShow equal to the length of slides, infinite functionality is not working.

[amitk7407]

demo: https://codesandbox.io/s/react-slick-playground-yjk35?file=/index.js

Even after using { arrows: true, dots: true, infinite: true} when slideToShow equals to the length of slides, no pre/post cloned slides are being rendered which usually happens when infinite is set to true. Arrows and Dots are also not being rendered in this case.

[amitk7407]

Hi,

I have got a workaround for this issue, so sharing it thinking it may help.

Suppose, slidesToShow = totalSlides = 3, then instead of passing 3 to slidesToShow, we can pass 2.99 which will show arrows and dots and add cloned slides. And if you are using centerMode: true, then the slides in this case will not be centered so for this, add css like:
.slick-slide { transform: translate(100%, 0); }
This will move your slide by 1 which works in case of 3 visible slides. You can translate based of your number of visible slides.

[quyctd]

+1, I have the same issue. The workaround method from @amitk7407 is working 👍

[MatheusR42]

+1, SAME ISSUE

[stressed-pet-owner]

Same issue. Although @amitk7407 solution made my slider infinite.. it doesn't look good because it is cut

https://share.getcloudapp.com/jkuL1n97

[TanelMarran]

+1, same issue.

[rjsdnql123]

It has been resolved in the latest version! Now you can use infinite even when 'element' and slideToShow are the same.

[akiran]

Fixed in react-slick@0.30.0