Как разобраться с анимацией Vue.js?

Question

[myskypesla]

Написал небольшой переход https://jsfiddle.net/q5eud1yx/11/, подскажите как сделать чтобы при клике на кнопку любую, к тексту к примеру "Слайд 2", был применён transition?

Answer 1

[wostex]

Работающий вариант: https://jsfiddle.net/wostex/mxgfc5yu/1/

Слайды должны быть внутри блока `transition`, и у каждого элемента должен быть уникальный `key`

Comments

[myskypesla]

wostex Спасибо большое!

[myskypesla]

wostex А вы не знаете, как сделать разную анимацию? К примеру для key="1" длительность transition была одна, а для key="2" другая?

[wostex]

<transition :duration="1000">...</transition>

Вместо 1000 может быть метод, который выдет время динамически.

Документация: https://vuejs.org/v2/guide/transitions.html#Explic...

[myskypesla]

wostex: Спасибо!