root
/
vue3-core
mirror of https://github.com/vuejs/core.git
1
0
Fork 0
Code Issues Actions 3 Packages Projects Releases Wiki Activity

fix(transition): transition is breaking/flickering when enter is canceled (#10688) 

Co-authored-by: Vadim Kruglov <vadim.kruglov@libertexgroup.com>
This commit is contained in:
Vadim Kruglov 2024-04-22 14:10:08 +07:00 committed by GitHub
parent 88c9d264ea
commit 65109a70f1
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 3 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
packages/runtime-dom/src/components/Transition.ts
View File

@ -239,9 +239,11 @@ export function resolveTransitionProps(
if (__COMPAT__ && legacyClassEnabled && legacyLeaveFromClass) { if (__COMPAT__ && legacyClassEnabled && legacyLeaveFromClass) {
addTransitionClass(el, legacyLeaveFromClass) addTransitionClass(el, legacyLeaveFromClass)
} }
// add *-leave-active class before reflow so in the case of a cancelled enter transition
// the css will not get the final state (#10677)
addTransitionClass(el, leaveActiveClass)
// force reflow so *-leave-from classes immediately take effect (#2593) // force reflow so *-leave-from classes immediately take effect (#2593)
forceReflow() forceReflow()
addTransitionClass(el, leaveActiveClass)
nextFrame(() => { nextFrame(() => {
if (!el._isLeaving) { if (!el._isLeaving) {
// cancelled // cancelled