高级表单支持插槽

src/components/form/AdvancedForm.vue

@@ -41,7 +41,11 @@ const formData = computed(() => {
     <el-row :gutter="20">
       <el-col :span="sub.span || formConfig.span || 12" v-for="(sub, key) in item.group" :key="key">
         <el-form-item :label="sub.label" :rules="sub.rules" :prop="sub.name">
-          <form-comp :item="sub" v-model="formData[sub.name]"></form-comp>
+          <form-comp :item="sub" v-model="formData[sub.name]">
+            <template #[slot.alias] v-for="slot in sub.slots" :key="slot.alias">
+              <slot :name="slot.alias"></slot>
+            </template>
+          </form-comp>
         </el-form-item>
       </el-col>
     </el-row>

src/components/form/ProForm.vue

@@ -62,7 +62,11 @@ defineExpose({
 
 <template>
   <el-form :model="formInitData" ref="formRef" v-bind="formProps" class="form">
-    <advanced-form :formConfig="formConfig" :formData="formInitData" v-if="formConfig.advanced" />
+    <advanced-form :formConfig="formConfig" :formData="formInitData" v-if="formConfig.advanced">
+      <template #[slot.alias] v-for="slot in formSlots" :key="slot.alias">
+        <slot :name="slot.alias"></slot>
+      </template>
+    </advanced-form>
     <basic-form :formConfig="formConfig" :formData="formInitData" v-else>
       <template #[slot.alias] v-for="slot in formSlots" :key="slot.alias">
         <slot :name="slot.alias"></slot>

src/views/form/Advanced.vue

@@ -26,7 +26,13 @@ const formConfig = reactive<AdvancedForm>({
           label: '字段名',
           value: '',
           name: 'name',
-          type: 'input'
+          type: 'input',
+          slots: [
+            {
+              name: 'prepend',
+              alias: 'prepend'
+            }
+          ]
         }
       ]
     },
@@ -175,13 +181,9 @@ const handleSave = () => {
 
 <template>
   <div class="overflow-auto pb-42px" style="height: calc(100vh - 101px - var(--main-padding) * 2)">
-    <pro-form
-      :formConfig="formConfig"
-      :formData="formData"
-      :create="create"
-      :update="update"
-      ref="proFormRef"
-    ></pro-form>
+    <pro-form :formConfig="formConfig" :formData="formData" :create="create" :update="update" ref="proFormRef">
+      <template #prepend>test</template>
+    </pro-form>
     <div
       class="fixed bottom-0 right-0 text-right bg-white px-16px py-5px form-footer"
       style="width: calc(100vw - var(--menu-width))"