下拉多选框问题修改

src/components/Form/src/componentMap.ts

@@ -35,6 +35,7 @@ import { IconPicker } from '@/components/Icon';
 import { CountdownInput } from '@/components/CountDown';
 import { BasicTitle } from '@/components/Basic';
 import { CropperAvatar } from '@/components/Cropper';
+import CustomSelect from './components/CustomSelect.vue';
 
 const componentMap = new Map<ComponentType | string, Component>();
 
@@ -49,7 +50,7 @@ componentMap.set('ImageUpload', ImageUpload);
 componentMap.set("VideoUpload",VideoUpload);
 componentMap.set("FileUpload",FileUpload);
 componentMap.set("Location",Location);
-componentMap.set('Select', Select);
+componentMap.set('Select', CustomSelect);
 componentMap.set('ApiSelect', ApiSelect);
 componentMap.set('ApiTree', ApiTree);
 componentMap.set('TreeSelect', TreeSelect);

src/components/Form/src/components/CustomSelect.vue

@@ -0,0 +1,50 @@
+<script setup>
+import { Select } from 'ant-design-vue'
+import { computed } from 'vue'
+
+const props = defineProps({
+  value: [String, Array],
+  mode: String,
+  separator: {
+    type: String,
+    default: ','
+  }
+})
+
+const emit = defineEmits(['update:value', 'change'])
+
+// 处理值的双向转换
+const internalValue = computed({
+  get() {
+    if (['multiple', 'tags'].includes(props.mode)) {
+      if (typeof props.value === 'string') {
+        return props.value ? props.value.split(props.separator) : []
+      }
+      return props.value || []
+    }
+    return props.value
+  },
+  set(newVal) {
+    if (['multiple', 'tags'].includes(props.mode)) {
+      const strValue = Array.isArray(newVal) 
+        ? newVal.join(props.separator)
+        : ''
+      emit('update:value', strValue)
+      emit('change', strValue)
+    } else {
+      emit('update:value', newVal)
+      emit('change', newVal)
+    }
+  }
+})
+</script>
+
+<template>
+  <Select
+    v-model:value="internalValue"
+    :mode="mode"
+    v-bind="$attrs"
+  >
+    <slot></slot>
+  </Select>
+</template>