Accessing state about react-animated-slider

[erichbehrens]

Hi @Asher978 , the feature you requested is included in the latest version. You can use it like this:

<Slider onSlideChange={event => console.log(event.slideIndex)}>

[erichbehrens]

Hi @Asher978, at the moment there is no clean way to achieve this. We would need to add an onChange prop which could look like <Slider onChange={slideIndex => console.log('Slide index changed to', slideIndex)}> and should be called after each navigation. At the moment I'm unsure if we might also need onBeforeChange or maybe pass an event object with both the previous and next slide index. Any thoughts? You're welcome to contribute, otherwise I can take a look at it in the next days/week.

In the meantime, here you can find a workaround which is accessing the component state through ref. It can only run on demand (ie: some user action or timer) and will not update automatically when the index changes: https://codesandbox.io/s/21mv1vy52r

[Asher978]

Isn't pressing the button for the next slide is an onDemand action. What if we request the state on that click for next slide. Going to give it a shot.

[erichbehrens]

Yes, but you would miss slide change events by touch (you can still set the touchDisabled prop) and autoplay. You'll probably need to add click event listeners to the buttons through the parent component, which is not the react way of doing things. That's why I suggested adding an onChange prop.

[Asher978]

WONDERFUL..... really appreciate the fast turnaround on this.

I will test it out over the weekend!!

[Asher978]

works as expected.

Thanks again!