How to access the index of a slide ? about react-gallery-carousel HOT 10 CLOSED

Ok , Thank you @yifaneye . Will try to do this.

from react-gallery-carousel.

Hi @AnmolChhabra98 ! Thank you for bringing this issue up! 😄

If you mean the index of every slide, you can put your slides in an array and then use slides.map((slide, index) => {});. 😉

If you mean the index of the current slide, you can pass a callback function to onIndexChange. Please see

from react-gallery-carousel.

@yifaneye Thanks for your response . Yes , please update the documentation as it will be easy to understand then understanding from the code itself.

I tried onIndexChange argument but the problem with this is if you have hasDotButtons and you click on the same index or dot button of an image which identifies the same index . onIndexChange will trigger for this case also but it should not I guess because you are on the same index.

from react-gallery-carousel.

Steps to reproduce :

1. Use hasDotButtons in your component.
2. Click on the present dot button.
3. Your onIndexChange will trigger instead of change in the Index.

from react-gallery-carousel.

Hi, @AnmolChhabra98 !

I think I get what you mean. The onIndexChange prop currently is called regardless of whether index value's before and after are the same. I will see what I am able to improve it this week.

from react-gallery-carousel.

Thanks @yifaneye It would be great .

Can you please also tell me . Is it possible to use text , photos , videos in a single component
eg: Text slide then some photos slide and then a video slide ?

from react-gallery-carousel.

Hi @AnmolChhabra98 !

Currently, the children prop is served as an option for "user-managed" slides. Since I believe that developer users may have their own element to be placed in each slide. Please see https://github.com/yifaneye/react-gallery-carousel#q-how-to-place-video-text-or-any-element-into-a-slide.

from react-gallery-carousel.

Thanks @yifaneye for this info and for your wonderful package .

Can you please guide me how can I toggle between object-fit value on minimized and maximized slide ? I am using user managed slides now the way you told me in above comment . I have tried toggleIsMaximized() . I am using this carousel component in one of my functional component. It would be a great help if I am able to do this .

from react-gallery-carousel.

Hi @AnmolChhabra98 !

Thank you for your appreciation! You can define an isMaximized state and pass it down to both the carousel component and your img element. When you pass to your img element, you can have a different object-fit value as style based on the isMaximized state (or isMaximized prop depending on whether you break down your components). Hope this helps!

from react-gallery-carousel.

No worries @AnmolChhabra98

from react-gallery-carousel.