fix(transition): handle edge case of cancel leave before next frame

fix #4462
This commit is contained in:
Evan You 2022-05-12 15:39:34 +08:00
parent 9309b044bd
commit 59cf2958e7

View File

@ -174,7 +174,10 @@ export function resolveTransitionProps(
done && done()
}
let isLeaving = false
const finishLeave = (el: Element, done?: () => void) => {
isLeaving = false
removeTransitionClass(el, leaveFromClass)
removeTransitionClass(el, leaveToClass)
removeTransitionClass(el, leaveActiveClass)
done && done()
@ -221,6 +224,7 @@ export function resolveTransitionProps(
onEnter: makeEnterHook(false),
onAppear: makeEnterHook(true),
onLeave(el, done) {
isLeaving = true
const resolve = () => finishLeave(el, done)
addTransitionClass(el, leaveFromClass)
if (__COMPAT__ && legacyClassEnabled) {
@ -230,6 +234,10 @@ export function resolveTransitionProps(
forceReflow()
addTransitionClass(el, leaveActiveClass)
nextFrame(() => {
if (!isLeaving) {
// cancelled
return
}
removeTransitionClass(el, leaveFromClass)
if (__COMPAT__ && legacyClassEnabled) {
removeTransitionClass(el, legacyLeaveFromClass)