search

akiran / react-slick

React carousel component
http://react-slick.neostack.com/
MIT License
11.72k stars 2.1k forks source link

Responsive - Incorrect Number of Dots Rendered and Disabled Arrow Bug #1642

Open patricktran opened 4 years ago

patricktran commented 4 years ago

CodeSandBox: https://codesandbox.io/s/suspicious-dew-z6jzv

Steps to reproduce: 1) Adjust Width so that 4 slides show at once 2) Keep on clicking Next arrow until you reach the last slide 3) Click on the Previous arrow 4) Click on the Next arrow (last slide) 5) Reduce Width so that 3 slides show at once 6) Bug #1: Notice that you cannot go to the last slide 7) Click on the Previous arrow towards slide #1 8) Bug #2: Notice there is no Dot to navigate to slide # 1

react-slick-bug-codesandbox

MohammedAlasaad commented 4 years ago

Hi @patricktran , I noticed you did not add magic-slider-dots package, I have added it here but it does not work: https://codesandbox.io/s/distracted-ishizaka-kmbvl

patricktran commented 4 years ago

@Mohammedalasaad That is correct, I did not add the magic-silder-dots package. The magic-slider-dots depends on dot props from react-slick. So if react-slick is passing in bad dot props to magic-slider-dots, then it will not work correctly.

This responsive issue you are encountering needs to be fixed within react-slick first.