qwewq

src/components/MyComponents/Date/index.vue

@@ -1,12 +1,21 @@
 <template>
   <div class="form-item-box" :style="{ width: width }">
-    <el-date-picker style="width:100%" v-model="modelValue" type="date" v-bind="$attrs" @change="onInput" :placeholder="placeholder" :value-format="props.format"/>
+    <el-date-picker 
+      style="width:100%" 
+      v-model="localModelValue" 
+      :type="props.type" 
+      v-bind="$attrs" 
+      @change="onInput" 
+      :placeholder="placeholder" 
+      :value-format="props.format"
+    />
   </div>
 </template>
 
 <script setup>
 import { COMPONENT_WIDTH } from "@/constant";
-import { ref, defineProps, defineEmits, defineExpose } from "vue";
+import { ref, defineProps, defineEmits, defineExpose, computed } from "vue";
+
 const props = defineProps({
   //获取组件传值
   placeholder: {
@@ -25,12 +34,21 @@ const props = defineProps({
     default: COMPONENT_WIDTH,
     type: String
   },
-  
+  type: {
+    default: "date",
+    type: String
+  }
 });
 
 const emits = defineEmits(["update:modelValue"]);
+
+// 使用计算属性处理双向绑定
+const localModelValue = computed({
+  get: () => props.modelValue,
+  set: (value) => emits("update:modelValue", value)
+});
+
 const onInput = (e) => {
   emits("update:modelValue", e);
 };
-</script>
+</script>
-