fix(Transition): Make transition behavior in KeepAlive in dev-mode consistent with production-mode. #5557

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Open

ygj6 wants to merge 2 commits into vuejs:main

from ygj6:fix-5500

Open

fix(Transition): Make transition behavior in KeepAlive in dev-mode consistent with production-mode. #5557

ygj6 wants to merge 2 commits into vuejs:main from ygj6:fix-5500

Conversation

@ygj6

Copy link

Member

@ygj6 ygj6 commented Mar 10, 2022 •

edited

Loading

fix: #5500
In this example, click Page A and then click Page B. Page A moves to the left, which is inconsistent with the name of the Transition node.This is due to the fact that

core/packages/runtime-core/src/componentRenderUtils.ts

Lines 221 to 229 in 5898629

if (vnode.transition) {

if (__DEV__ && !isElementRoot(root)) {

warn(

`Component inside <Transition> renders non-element root node ` +

`that cannot be animated.`

)

}

root.transition = vnode.transition

}

It adjusts the position of the transition, so the last transition is used when moving. Now let's update it manually

@ygj6


 fix(runtime-core): Make transition behavior in KeepAlive in dev-mode ...

36ee6c6

...consistent with production-mode.

@netlify

Copy link

netlify bot commented Mar 10, 2022 •

edited

Loading

✅ Deploy Preview for vue-sfc-playground ready!

Name	Link
🔨 Latest commit	`bc06f4a`
🔍 Latest deploy log	https://app.netlify.com/sites/vue-sfc-playground/deploys/625d0b92e4278f00088e78ad
😎 Deploy Preview	https://deploy-preview-5557--vue-sfc-playground.netlify.app/
📱 Preview on mobile	Toggle QR Code... QR Code Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site settings.

@netlify

Copy link

netlify bot commented Mar 10, 2022 •

edited

Loading

✅ Deploy Preview for vuejs-coverage ready!

Name	Link
🔨 Latest commit	`bc06f4a`
🔍 Latest deploy log	https://app.netlify.com/sites/vuejs-coverage/deploys/625d0b92ce99ee0008ad4ab0
😎 Deploy Preview	https://deploy-preview-5557--vuejs-coverage.netlify.app
📱 Preview on mobile	Toggle QR Code... QR Code Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site settings.

@netlify

Copy link

netlify bot commented Mar 10, 2022 •

edited

Loading

✅ Deploy Preview for vue-next-template-explorer ready!

Name	Link
🔨 Latest commit	`bc06f4a`
🔍 Latest deploy log	https://app.netlify.com/sites/vue-next-template-explorer/deploys/625d0b921433200009a7a481
😎 Deploy Preview	https://deploy-preview-5557--vue-next-template-explorer.netlify.app
📱 Preview on mobile	Toggle QR Code... QR Code Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site settings.

@edison1105

Copy link

Member

edison1105 commented Mar 10, 2022 •

edited

Loading

is this same as #5268 ?🤔

@ygj6

Copy link

Member Author

ygj6 commented Mar 10, 2022

is this same as #5268 ?🤔

Not exactly, because components are not uninstalled in keepalive, but I believe there should be a similar problem in 5268.

@ygj6


 Merge branch 'main' into fix-5500

bc06f4a

@sxzz sxzz force-pushed the main branch from 39d4fc1 to 1b56405 Compare

August 21, 2023 05:00

@edison1105 edison1105 changed the title ~~(削除) fix(runtime-core): Make transition behavior in KeepAlive in dev-mode consistent with production-mode. (削除ここまで)~~ (追記) fix(Transition): Make transition behavior in KeepAlive in dev-mode consistent with production-mode. (追記ここまで)

Sep 3, 2024

@edison1105 edison1105 added 🐞 bug scope: transition labels

Sep 3, 2024

@edison1105

Copy link

Member