From 71fb98140912804000c7851de92acef9718b7b79 Mon Sep 17 00:00:00 2001
From: jiezi19971225 <jiezi19971225@gmail.com>
Date: Thu, 26 Aug 2021 09:26:55 +0800
Subject: [PATCH] fix(vue): fix 'x-content' render named slot not work (#2046)

on void field and object field
---
 .../vue/src/__tests__/schema.json.spec.ts     | 40 +++++++++++++++++++
 packages/vue/src/components/RecursionField.ts | 10 ++++-
 2 files changed, 49 insertions(+), 1 deletion(-)

diff --git a/packages/vue/src/__tests__/schema.json.spec.ts b/packages/vue/src/__tests__/schema.json.spec.ts
index 5bd85638089..facd2e8d8e5 100644
--- a/packages/vue/src/__tests__/schema.json.spec.ts
+++ b/packages/vue/src/__tests__/schema.json.spec.ts
@@ -310,6 +310,46 @@ describe('x-content', () => {
     expect(queryByTestId('previewer2')).toBeVisible()
     expect(queryByTestId('previewer2').textContent).toEqual('123')
   })
+
+  test('named slot in void field', () => {
+    const form = createForm()
+    const Content = {
+      render(h) {
+        return h('span', '123')
+      },
+    }
+    const { SchemaField } = createSchemaField({
+      components: {
+        Previewer2,
+      },
+      scope: {
+        Content,
+      },
+    })
+    const { queryByTestId } = render({
+      components: { SchemaField },
+      data() {
+        return {
+          form,
+          schema: new Schema({
+            type: 'void',
+            'x-component': 'Previewer2',
+            'x-content': {
+              content: '{{Content}}',
+            },
+          }),
+        }
+      },
+      template: `<FormProvider :form="form">
+        <SchemaField
+          name="string"
+          :schema="schema"
+        />
+      </FormProvider>`,
+    })
+    expect(queryByTestId('previewer2')).toBeVisible()
+    expect(queryByTestId('previewer2').textContent).toEqual('123')
+  })
 })
 
 describe('scope', () => {
diff --git a/packages/vue/src/components/RecursionField.ts b/packages/vue/src/components/RecursionField.ts
index bf7fd374fd5..d18087ba025 100644
--- a/packages/vue/src/components/RecursionField.ts
+++ b/packages/vue/src/components/RecursionField.ts
@@ -154,7 +154,11 @@ const RecursionField = observer(
             }
           )
 
-          const slots = getSlots(children)
+          const slots: Record<string, () => any> = {}
+          const allSlots = getSlots(children)
+          if (allSlots.default) {
+            slots.default = allSlots.default
+          }
 
           return h(Fragment, {}, slots)
         }
@@ -163,6 +167,7 @@ const RecursionField = observer(
           if (!isValid(props.name)) return renderProperties()
           if (fieldSchemaRef.value.type === 'object') {
             if (props.onlyRenderProperties) return renderProperties()
+            const slots = getSlots()
             return h(
               ObjectField,
               {
@@ -173,6 +178,7 @@ const RecursionField = observer(
                 },
               },
               {
+                ...slots,
                 default: ({ field }) => [renderProperties(field)],
               }
             )
@@ -191,6 +197,7 @@ const RecursionField = observer(
             )
           } else if (fieldSchemaRef.value.type === 'void') {
             if (props.onlyRenderProperties) return renderProperties()
+            const slots = getSlots()
             return h(
               VoidField,
               {
@@ -201,6 +208,7 @@ const RecursionField = observer(
                 },
               },
               {
+                ...slots,
                 default: ({ field }) => [renderProperties(field)],
               }
             )