Я создаю компонент диалога, который встраивает наложение, которое затеняет остальную часть экрана, предотвращая любые действия.Мне бы хотелось, чтобы само диалоговое окно отображалось со скользящим эффектом, в то время как наложение постепенно исчезает (и наоборот при исчезновении).
Каким-то образом эффекты работают хорошо при закрытии диалога, но при открытии, когда "переход"", оверлей не отображается должным образом, имея высоту 0 пикселей ..
JsFiddle (диалоговое окно появляется через 1 секунду, щелкните оверлей, чтобы закрыть его)
Я пытался заставить переход применить только к непрозрачности с помощью следующего кода, но безрезультатно.
.fade-enter-active {
transition: all 0s;
transition: opacity .3s;
}
Есть идеи, что здесь не так?