From 30374397dd0640770e1a40c460b1f76d205938d5 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=A6=82=E4=BB=8A?=
 <11555891+metabytes@user.noreply.gitee.com>
Date: Tue, 8 Apr 2025 08:40:23 +0000
Subject: [PATCH] =?UTF-8?q?update=20src/components/Dict/index.vue.=201.=20?=
 =?UTF-8?q?type=20=E6=94=AF=E6=8C=81=20select-multiple=EF=BC=8C=E5=8E=9F?=
 =?UTF-8?q?=E6=9D=A5=E7=9A=84=20type=20validator=20=E6=B2=A1=E5=8C=85?=
 =?UTF-8?q?=E5=90=AB=E5=AE=83=E3=80=82=202.=20selectedValue=20=E5=88=9D?=
 =?UTF-8?q?=E5=A7=8B=E5=8C=96=E9=80=BB=E8=BE=91=E4=BC=98=E5=8C=96=E3=80=82?=
 =?UTF-8?q?=203.=20watch=20=E9=80=BB=E8=BE=91=E7=AE=80=E5=8C=96=EF=BC=8C?=
 =?UTF-8?q?=E9=81=BF=E5=85=8D=E4=B8=8D=E5=BF=85=E8=A6=81=E7=9A=84=E5=88=A4?=
 =?UTF-8?q?=E6=96=AD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Signed-off-by: 如今 <11555891+metabytes@user.noreply.gitee.com>
---
 src/components/Dict/index.vue | 39 ++++++++++++++---------------------
 1 file changed, 16 insertions(+), 23 deletions(-)

diff --git a/src/components/Dict/index.vue b/src/components/Dict/index.vue
index 35f3b48e..977d914a 100644
--- a/src/components/Dict/index.vue
+++ b/src/components/Dict/index.vue
@@ -1,6 +1,7 @@
 <template>
+  <!-- Select / Select-Multiple -->
   <el-select
-    v-if="type === 'select' || type === 'select-multiple'"
+    v-if="['select', 'select-multiple'].includes(type)"
     v-model="selectedValue"
     :placeholder="placeholder"
     :disabled="disabled"
@@ -17,6 +18,7 @@
     />
   </el-select>
 
+  <!-- Radio -->
   <el-radio-group
     v-else-if="type === 'radio'"
     v-model="selectedValue"
@@ -34,6 +36,7 @@
     </el-radio>
   </el-radio-group>
 
+  <!-- Checkbox -->
   <el-checkbox-group
     v-else-if="type === 'checkbox'"
     v-model="selectedValue"
@@ -53,6 +56,7 @@
 </template>
 
 <script setup lang="ts">
+import { ref, watch, onMounted } from "vue";
 import { useDictStore } from "@/store";
 
 const dictStore = useDictStore();
@@ -69,7 +73,8 @@ const props = defineProps({
   type: {
     type: String,
     default: "select",
-    validator: (value: string) => ["select", "radio", "checkbox"].includes(value),
+    validator: (value: string) =>
+      ["select", "select-multiple", "radio", "checkbox"].includes(value),
   },
   placeholder: {
     type: String,
@@ -81,11 +86,7 @@ const props = defineProps({
   },
   style: {
     type: Object,
-    default: () => {
-      return {
-        width: "300px",
-      };
-    },
+    default: () => ({ width: "300px" }),
   },
 });
 
@@ -93,37 +94,29 @@ const emit = defineEmits(["update:modelValue"]);
 
 const options = ref<Array<{ label: string; value: string | number }>>([]);
 
+// 动态初始化 selectedValue
 const selectedValue = ref<any>(
   ["select-multiple", "checkbox"].includes(props.type)
     ? Array.isArray(props.modelValue)
       ? props.modelValue
       : []
-    : typeof props.modelValue === "string" || typeof props.modelValue === "number"
-      ? props.modelValue
-      : undefined
+    : (props.modelValue ?? undefined)
 );
 
-// 监听 modelValue 和 options 的变化
+// 同步 selectedValue 与 props.modelValue
 watch(
-  [() => props.modelValue, () => props.type, () => options.value],
-  ([newValue, newType, newOptions]) => {
-    if (["select-multiple", "checkbox"].includes(newType)) {
+  () => props.modelValue,
+  (newValue) => {
+    if (["select-multiple", "checkbox"].includes(props.type)) {
       selectedValue.value = Array.isArray(newValue) ? newValue : [];
     } else {
-      if (newOptions.length > 0 && newValue !== undefined && newValue !== null) {
-        const matchedOption = newOptions.find(
-          (option) => String(option.value) === String(newValue)
-        );
-        selectedValue.value = matchedOption?.value ?? undefined;
-      } else {
-        selectedValue.value = undefined;
-      }
+      selectedValue.value = newValue ?? undefined;
     }
   },
   { immediate: true }
 );
 
-// 监听 selectedValue 的变化并触发 update:modelValue
+// selectedValue 改变时回传给父组件
 function handleChange(val: any) {
   emit("update:modelValue", val);
 }
-- 
Gitee