Как сделать анимацию фэйдом при смене компонента?

Question

[Vladislav]

Как сделать анимацию фэйдом при смене компонента роутингом, вариант с transition vue рассматривал, но что-то не выходит, анимация должна быть такая если css'ом: изначально компонент opacity: 0; transition: 1s;, после смены компонента, он становится opacity: 1; Посоветуйте пожалуйста что либо или готовую анимацю, буду благодарен, спасибо

Answer 1

[h4mpy]

https://jsfiddle.net/h4mpy/gpwecyka/3/

Comments

[Vladislav]

h4mpy более менее похоже, но спасибо, не подскажешь атрибут name и mode в transition что значит?

[h4mpy]

"name" подставляется в название класса вместо стандартного "v".
а "mode" - режим перехода, либо out-in, либо in-out
См. Классы переходов и Режимы переходов - https://ru.vuejs.org/v2/guide/transitions.html