Kaynağa Gözat

feat(runtime-vapor): support render block in createDynamicComponent (#14213)

edison 4 ay önce
ebeveyn
işleme
ddc1baecb9

+ 11 - 0
packages/runtime-vapor/__tests__/apiCreateDynamicComponent.spec.ts

@@ -179,4 +179,15 @@ describe('api: createDynamicComponent', () => {
       '<div><span>hi</span><!--slot--></div><!--dynamic-component-->',
     )
   })
+
+  test('accept blocks', async () => {
+    const { html } = define({
+      setup() {
+        const n0 = template('<a>router link</a>')()
+        return createDynamicComponent(() => n0)
+      },
+    }).render()
+
+    expect(html()).toBe('<a>router link</a><!--dynamic-component-->')
+  })
 })

+ 12 - 9
packages/runtime-vapor/src/apiCreateDynamicComponent.ts

@@ -1,5 +1,5 @@
 import { currentInstance, resolveDynamicComponent } from '@vue/runtime-dom'
-import { insert } from './block'
+import { insert, isBlock } from './block'
 import { createComponentWithFallback, emptyContext } from './component'
 import { renderEffect } from './renderEffect'
 import type { RawProps } from './componentProps'
@@ -36,14 +36,17 @@ export function createDynamicComponent(
       (currentInstance && currentInstance.appContext) || emptyContext
     frag.update(
       () =>
-        createComponentWithFallback(
-          resolveDynamicComponent(value) as any,
-          rawProps,
-          rawSlots,
-          isSingleRoot,
-          once,
-          appContext,
-        ),
+        // Support integration with VaporRouterView/VaporRouterLink by accepting blocks
+        isBlock(value)
+          ? value
+          : createComponentWithFallback(
+              resolveDynamicComponent(value) as any,
+              rawProps,
+              rawSlots,
+              isSingleRoot,
+              once,
+              appContext,
+            ),
       value,
     )
   }