<template>
<ul class="slider__info-list">
<li
v-for="(slide, idx) in slides"
:key="slide.img"
>
<transition name="slide-up" mode="out-in">
<VSliderInfoItem
v-show="idx === currentSlide"
:slide="slide"
/>
</transition>
</li>
</ul>
</template>
Анимация отрабатывает некорректно. Т.к он анимацию появления и исчезновения выполняет для каждого элемента постоянно.
Меня интересует эффект пролистывания. По нажатию на стрелку он смещается в сторону стрелки, а после с противоположной стороны выезжает другой.
Как это сделать с элементами нативного JS мне ясно. Но могу ли я реализовать данную логику с использованием vue?
P.S Мне видеться вариант с перерисовкой компонента, но кажется, заранее подгрузить и скрыть все элементы является лучшей практикой, чем вариант с перерисовкой.