From 43976afbeee21f159d8e11d635600980d647b39f Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=90=95=E9=87=91=E6=B3=BD?= <1098696801@qq.com>
Date: Fri, 25 Mar 2022 17:14:28 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E5=A4=8D=E7=BB=84=E4=BB=B6=E6=89=93?=
 =?UTF-8?q?=E5=8C=85=E5=90=8E=E5=87=BA=E7=8E=B0=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 magic-boot-ui/src/components/magic/form/mb-date.vue    | 10 ++++++++--
 magic-boot-ui/src/components/magic/form/mb-input.vue   |  9 +++++++--
 .../src/components/magic/form/mb-radio-group.vue       |  9 +++++++--
 magic-boot-ui/src/components/magic/form/mb-switch.vue  | 10 ++++++++--
 .../src/components/magic/form/mb-treeselect.vue        |  7 ++++++-
 5 files changed, 36 insertions(+), 9 deletions(-)

diff --git a/magic-boot-ui/src/components/magic/form/mb-date.vue b/magic-boot-ui/src/components/magic/form/mb-date.vue
index aa3e71e..cf5672f 100644
--- a/magic-boot-ui/src/components/magic/form/mb-date.vue
+++ b/magic-boot-ui/src/components/magic/form/mb-date.vue
@@ -1,6 +1,6 @@
 <template>
   <el-date-picker
-    v-model="modelValue"
+    v-model="selectValue"
     :type="type"
     :format="format"
     :value-format="valueFormat"
@@ -14,6 +14,7 @@
 <script setup>
   import { watch, ref } from 'vue'
   const emit = defineEmits(['update:modelValue'])
+  const selectValue = ref('')
   const props = defineProps({
     modelValue: String,
     type: String,
@@ -35,8 +36,13 @@
     },
     props: Object
   })
-  const valueFormat = ref(props.format)
+
+  selectValue.value = props.modelValue
   watch(() => props.modelValue, (value) => {
+    selectValue.value = value
+  })
+  const valueFormat = ref(props.format)
+  watch(selectValue, (value) => {
     emit('update:modelValue', value)
   })
 </script>
diff --git a/magic-boot-ui/src/components/magic/form/mb-input.vue b/magic-boot-ui/src/components/magic/form/mb-input.vue
index e2121f7..8e8e573 100644
--- a/magic-boot-ui/src/components/magic/form/mb-input.vue
+++ b/magic-boot-ui/src/components/magic/form/mb-input.vue
@@ -1,10 +1,11 @@
 <template>
-  <el-input v-model="modelValue" :type="type" :placeholder="placeholder || (itemLabel && '请输入' + itemLabel)" v-bind="props.props" />
+  <el-input v-model="selectValue" :type="type" :placeholder="placeholder || (itemLabel && '请输入' + itemLabel)" v-bind="props.props" />
 </template>
 
 <script setup>
-  import { watch } from 'vue'
+import {ref, watch} from 'vue'
   const emit = defineEmits(['update:modelValue'])
+  const selectValue = ref('')
   const props = defineProps({
     modelValue: String,
     itemLabel: String,
@@ -12,7 +13,11 @@
     type: String,
     props: Object
   })
+  selectValue.value = props.modelValue
   watch(() => props.modelValue, (value) => {
+    selectValue.value = value
+  })
+  watch(selectValue, (value) => {
     emit('update:modelValue', value)
   })
 </script>
diff --git a/magic-boot-ui/src/components/magic/form/mb-radio-group.vue b/magic-boot-ui/src/components/magic/form/mb-radio-group.vue
index 61e095c..77e8679 100644
--- a/magic-boot-ui/src/components/magic/form/mb-radio-group.vue
+++ b/magic-boot-ui/src/components/magic/form/mb-radio-group.vue
@@ -1,6 +1,6 @@
 <template>
   <el-radio-group
-    v-model="modelValue"
+    v-model="selectValue"
     :size="size"
     :disabled="disabled"
     :text-color="textColor"
@@ -22,6 +22,7 @@
   const emit = defineEmits(['update:modelValue', 'change'])
   const { proxy } = getCurrentInstance()
 
+  const selectValue = ref('')
   const props = defineProps({
     modelValue: String | Number | Boolean,
     type: String,
@@ -59,6 +60,8 @@
     }
   })
 
+  selectValue.value = props.modelValue
+
   const options = ref([])
 
   if(props.type){
@@ -83,8 +86,10 @@
   function change(value){
     emit('change', value)
   }
-
   watch(() => props.modelValue, (value) => {
+    selectValue.value = value
+  })
+  watch(selectValue, (value) => {
     emit('update:modelValue', value)
   })
 </script>
diff --git a/magic-boot-ui/src/components/magic/form/mb-switch.vue b/magic-boot-ui/src/components/magic/form/mb-switch.vue
index 6a11559..4bf79c6 100644
--- a/magic-boot-ui/src/components/magic/form/mb-switch.vue
+++ b/magic-boot-ui/src/components/magic/form/mb-switch.vue
@@ -1,6 +1,6 @@
 <template>
   <el-switch
-    v-model="modelValue"
+    v-model="selectValue"
     :active-value="activeValue"
     :inactive-value="inactiveValue"
     v-bind="props.props"
@@ -8,8 +8,9 @@
 </template>
 
 <script setup>
-  import { watch } from 'vue'
+import {ref, watch} from 'vue'
   const emit = defineEmits(['update:modelValue'])
+  const selectValue = ref(false)
   const props = defineProps({
     modelValue: {
       type: Boolean,
@@ -19,7 +20,12 @@
     inactiveValue: Boolean | String | Number,
     props: Object
   })
+
+  selectValue.value = props.modelValue
   watch(() => props.modelValue, (value) => {
+    selectValue.value = value
+  })
+  watch(selectValue, (value) => {
     emit('update:modelValue', value)
   })
 </script>
diff --git a/magic-boot-ui/src/components/magic/form/mb-treeselect.vue b/magic-boot-ui/src/components/magic/form/mb-treeselect.vue
index 3a9ece2..c5f5020 100644
--- a/magic-boot-ui/src/components/magic/form/mb-treeselect.vue
+++ b/magic-boot-ui/src/components/magic/form/mb-treeselect.vue
@@ -1,10 +1,11 @@
 <template>
-  <treeselect v-model="modelValue" :options="options" :key="modelValue" :placeholder="placeholder || (itemLabel && '请选择' + itemLabel)" :show-count="true" v-bind="props.props" />
+  <treeselect v-model="selectValue" :options="options" :key="modelValue" :placeholder="placeholder || (itemLabel && '请选择' + itemLabel)" :show-count="true" v-bind="props.props" />
 </template>
 
 <script setup>
   import { ref, getCurrentInstance, watch } from "vue"
   const emit = defineEmits(['update:modelValue'])
+  const selectValue = ref(null)
   const { proxy } = getCurrentInstance()
   const props = defineProps({
     modelValue: {
@@ -21,7 +22,11 @@
     props: Object
   })
 
+  selectValue.value = props.modelValue
   watch(() => props.modelValue, (value) => {
+    selectValue.value = value
+  })
+  watch(selectValue, (value) => {
     emit('update:modelValue', value)
   })