fix: 优化表单

src/components/ProForm/components/Item.vue

@@ -2,7 +2,7 @@
   <component
     :is="elTagNameValue"
     v-bind="item.compOptions"
-    v-model.trim="_model"
+    v-model.trim="_model[handleProp(item.prop)]"
     :data="['tree-select'].includes(item.compOptions.elTagName!) ? itemEnum : []"
     :options="['cascader', 'select-v2'].includes(item.compOptions.elTagName!) ? itemEnum : []"
   >
@@ -42,19 +42,14 @@
 </template>
 
 <script setup lang="ts" name="Item">
+import { handleProp } from '@/utils'
 interface FormItem {
   item: ProForm.ItemsOptions
-  model: any
+  model: Record<string, any>
 }
 const props = defineProps<FormItem>()
-const _model = ref({})
-watch(
-  () => props.model,
-  () => {
-    _model.value = props.model
-  },
-  { immediate: true }
-)
+const _model = computed(() => props.model)
+console.log('_model', _model)
 const elTagNameValue = computed(() => {
   const val = props.item.compOptions.elTagName
   if ('radio-button' == val) return `el-radio-group`

src/components/ProForm/index.vue

@@ -25,18 +25,18 @@
               <SelectIcon v-model:icon-value="formModel[handleProp(item.prop)]" />
             </template>
             <template v-else-if="item.compOptions.elTagName === 'file-upload'">
-              <FileUpload v-model:model-value="formModel[handleProp(item.prop)]" />
+              <FileUpload v-model:model-value="formModel[handleProp(item.prop)]" v-bind="$attrs" />
             </template>
             <template v-else-if="item.compOptions.elTagName === 'img-upload'">
               <Imgs v-model="formModel[handleProp(item.prop)]" v-bind="$attrs" />
             </template>
             <template v-else-if="item.compOptions.elTagName === 'file-upload-s3'">
-              <FileUploadS3 v-model:model-value="formModel[handleProp(item.prop)]" />
+              <FileUploadS3 v-model:model-value="formModel[handleProp(item.prop)]" v-bind="$attrs" />
             </template>
             <template v-else-if="item.compOptions.elTagName === 'img-upload-s3'">
               <ImgsS3 v-model="formModel[handleProp(item.prop)]" v-bind="$attrs" />
             </template>
-            <Item v-else :item="item" :model="formModel[handleProp(item.prop)]" />
+            <Item v-else :item="item" :model="formModel" />
           </component>
         </el-col>
       </template>
@@ -158,6 +158,7 @@ watch(
         ? (formModel.value = props.model)
         : (formModel.value[item.prop] = item.compOptions.value === 0 ? 0 : item.compOptions.value || value)
     })
+    console.log('formModel.value', formModel.value)
   },
   { immediate: true }
 )