Slide In and Out Animations on Button Click

[JosephOdili]

I have two buttons,

On the left called PreviousButton and another on the right called NextButton.

Now when any of the button is clicked I change the index. Changing the index works but the slide effect to the changed index isn't working.It just transitions to the new Index very fast without the slide in and out animations. Is there a workaround to this?

[caleb-harrelson]

Can you post a codesandbox demonstrating the issue? I'm aware of an issue with the first animation, but subsequent ones should work.

[naume]

@JosephOdili it works fine to me by using the handleChangeIndex function binded on the slider ref

      <button
        onClick={() => {
          sliderRef.current.handleChangeIndex(
            sliderRef.current.state.index - 1,
          );
        }}
        title="previous"
      >
        Prev
      </button>

I'm using the virualized one

const EnhancedSwipeableViews = bindKeyboard(virtualize(SwipeableViews));

<EnhancedSwipeableViews
        index={activeIndex}
        ref={sliderRef}
       slideRenderer={...}
>
</EnhancedSwipeableViews>