Skip to content

Commit 59cf295

Browse files
committed
fix(transition): handle edge case of cancel leave before next frame
fix #4462
1 parent 9309b04 commit 59cf295

File tree

1 file changed

+8
-0
lines changed

1 file changed

+8
-0
lines changed

Diff for: packages/runtime-dom/src/components/Transition.ts

+8
Original file line numberDiff line numberDiff line change
@@ -174,7 +174,10 @@ export function resolveTransitionProps(
174174
done && done()
175175
}
176176

177+
let isLeaving = false
177178
const finishLeave = (el: Element, done?: () => void) => {
179+
isLeaving = false
180+
removeTransitionClass(el, leaveFromClass)
178181
removeTransitionClass(el, leaveToClass)
179182
removeTransitionClass(el, leaveActiveClass)
180183
done && done()
@@ -221,6 +224,7 @@ export function resolveTransitionProps(
221224
onEnter: makeEnterHook(false),
222225
onAppear: makeEnterHook(true),
223226
onLeave(el, done) {
227+
isLeaving = true
224228
const resolve = () => finishLeave(el, done)
225229
addTransitionClass(el, leaveFromClass)
226230
if (__COMPAT__ && legacyClassEnabled) {
@@ -230,6 +234,10 @@ export function resolveTransitionProps(
230234
forceReflow()
231235
addTransitionClass(el, leaveActiveClass)
232236
nextFrame(() => {
237+
if (!isLeaving) {
238+
// cancelled
239+
return
240+
}
233241
removeTransitionClass(el, leaveFromClass)
234242
if (__COMPAT__ && legacyClassEnabled) {
235243
removeTransitionClass(el, legacyLeaveFromClass)

0 commit comments

Comments
 (0)