search

rcaferati / react-awesome-slider

React content transition slider. Awesome Slider is a 60fps, light weight, performant component that renders an animated set of production ready UI general purpose sliders with fullpage transition support for NextJS and GatsbyJS. 🖥️ 📱
https://fullpage.caferati.me
MIT License
2.92k stars 294 forks source link

programmatically navigate slides? #188

Open robsilva opened 3 years ago

robsilva commented 3 years ago

Is there an API to programmatically allow me to advance or go back slides? How might one go about doing that? The slide arrow button seem to be dynamically added by the plugin, so I can't really put a ref on them, can I?

itsdwizzy commented 2 years ago

@robsilva You could use the selected prop of <AwesomeSlider> to navigate between slides.

ghost commented 2 years ago

While this works, I run into the error myself where if changing the selected prop/attribute before the transitioning has completed from the previous change the slider will not update to reflect the new selected slider value. Has anyone figured out a strategy in handling this problem?

trolit commented 2 years ago

While this works, I run into the error myself where if changing the selected prop/attribute before the transitioning has completed from the previous change the slider will not update to reflect the new selected slider value. Has anyone figured out a strategy in handling this problem?

@jakermate Hi. Did you try to make use of onTransitionStart & onTransitionEnd props? First one is fired when you request slide change and second when transition ends. You could mix that with some boolean value that would disable button unless transition ends? :)

For more details check #185 and https://github.com/rcaferati/react-awesome-slider#main-props.