fix(keep-alive): fix render error in cached is undefined (#11496)

fix #11427 close #11431
vuejs · Aug 7, 2024 · 81351dc · 81351dc
1 parent 6c90324
commit 81351dc
Show file tree

Hide file tree

Showing 2 changed files with 15 additions and 9 deletions.
diff --git a/packages/runtime-core/__tests__/components/Suspense.spec.ts b/packages/runtime-core/__tests__/components/Suspense.spec.ts
@@ -2036,7 +2036,7 @@ describe('Suspense', () => {
     expect(serializeInner(root)).toBe(`<div>sync</div>`)
   })
 
-  // #10899
+  // #10899 / #11427
   test('KeepAlive + Suspense switch before branch resolves', async () => {
     const Async1 = defineAsyncComponent({
       render() {
@@ -2053,14 +2053,20 @@ describe('Suspense', () => {
     const root = nodeOps.createElement('div')
     const App = {
       render() {
-        return h(KeepAlive, null, {
-          default: () => {
-            return h(Suspense, null, {
-              default: h(components[viewRef.value]),
-              fallback: h('div', 'loading'),
-            })
+        return h(
+          KeepAlive,
+          {
+            max: 1,
           },
-        })
+          {
+            default: () => {
+              return h(Suspense, null, {
+                default: h(components[viewRef.value]),
+                fallback: h('div', 'loading'),
+              })
+            },
+          },
+        )
       },
     }
     render(h(App), root)

diff --git a/packages/runtime-core/src/components/KeepAlive.ts b/packages/runtime-core/src/components/KeepAlive.ts
@@ -206,7 +206,7 @@ const KeepAliveImpl: ComponentOptions = {
 
     function pruneCacheEntry(key: CacheKey) {
       const cached = cache.get(key) as VNode
-      if (!current || !isSameVNodeType(cached, current)) {
+      if (cached && (!current || !isSameVNodeType(cached, current))) {
         unmount(cached)
       } else if (current) {
         // current active instance should no longer be kept-alive.