0

I have two elements in the slider. I noticed that it actually creates 5 other slides. They have data-index varying from -1 to 3.

enter image description hereRendering just one element does not have this issue. It only shows a single element in the DOM.

The component I am rendering is in position 1.

Is there any way to remove the clone slide elements in the DOM?

The problem I am having is that the slides at position -1 and 3 have a div with the same id.

Now when I do document.getElementById() , I do not get the properties of the actual component in view.

`

Sagar Acharya
  • 1,763
  • 2
  • 19
  • 38

1 Answers1

2

Looks like you can just pass {infinite:false} prop into the options and the issue is solved.

This is because react slick maintains two divs at both sides of the current element in view. This is to ensure that slide can happen even if the user scroll both ways.

Passing this prop negates that behaviour

Sagar Acharya
  • 1,763
  • 2
  • 19
  • 38