瀏覽代碼

fix(Transition): ensure the KeepAlive children unmount w/ out-in mode (#10632)

close #10620
edison 2 年之前
父節點
當前提交
fc99e4d3f0

+ 37 - 0
packages/runtime-core/__tests__/components/BaseTransition.spec.ts

@@ -7,6 +7,7 @@ import {
   h,
   nextTick,
   nodeOps,
+  onUnmounted,
   ref,
   render,
   serialize,
@@ -768,6 +769,42 @@ describe('BaseTransition', () => {
     test('w/ KeepAlive', async () => {
       await runTestWithKeepAlive(testOutIn)
     })
+
+    test('w/ KeepAlive + unmount innerChild', async () => {
+      const unmountSpy = vi.fn()
+      const includeRef = ref(['TrueBranch'])
+      const trueComp = {
+        name: 'TrueBranch',
+        setup() {
+          onUnmounted(unmountSpy)
+          const count = ref(0)
+          return () => h('div', count.value)
+        },
+      }
+
+      const toggle = ref(true)
+      const { props } = mockProps({ mode: 'out-in' }, true /*withKeepAlive*/)
+      const root = nodeOps.createElement('div')
+      const App = {
+        render() {
+          return h(BaseTransition, props, () => {
+            return h(
+              KeepAlive,
+              { include: includeRef.value },
+              toggle.value ? h(trueComp) : h('div'),
+            )
+          })
+        },
+      }
+      render(h(App), root)
+
+      // trigger toggle
+      toggle.value = false
+      includeRef.value = []
+
+      await nextTick()
+      expect(unmountSpy).toHaveBeenCalledTimes(1)
+    })
   })
 
   // #6835

+ 1 - 1
packages/runtime-core/src/components/KeepAlive.ts

@@ -254,7 +254,7 @@ const KeepAliveImpl: ComponentOptions = {
       pendingCacheKey = null
 
       if (!slots.default) {
-        return null
+        return (current = null)
       }
 
       const children = slots.default()