After using KeepAlive to switch routes, there is an error when referencing the component instance.

[yinfoyuan]

Vue version

3.5.18

Link to minimal reproduction

https://stackblitz.com/edit/vitejs-vite-d8g9pttj?file=src%2FApp.vue

Steps to reproduce

Change the route

What is expected?

No error occurred.

What is actually happening?

The variable has been overwritten.

System Info

Any additional comments?

No response

[edison1105]

When using KeepAlive, only the host node of the custom element is cached, while its shadow DOM content is not. When the component is switched back, the custom element will remount and re-render the shadow DOM, which is the expected behavior.

KeepAlive caches the vnode instance and the corresponding DOM node reference, and does not interfere with the rendering logic inside the custom element.