修复绑定的问题

src/components/xc/select/XcSelect.vue

@@ -1,12 +1,16 @@
 <template>
-  <el-select v-model="modelObj" :clearable="props.clearable"
-             :remote="props.remote" :remote-method="xcMethod"
+  <el-select v-model="modelObj"
+             :clearable="props.clearable"
+             :remote="props.remote"
+             :remote-method="xcMethod"
              :style="{width: props.width + 'px'}"
-             ref="xcselect" filterable @change="changeStaff"
+             ref="xcselect" filterable
+             @change="changeStaff"
              @clear="clear" @focus="getFocus">
-    <el-option v-for="(item,index) in props.data" :key="item.index"
+    <el-option v-for="(item,index) in props.data"
+               :key="item.index"
                :label="item.name"
-               :value="{value:item.code,label:item.name}">
+               :value="item.code">
       <template v-for="(opitem,index) in optionList" v-if="optionList.length > 0">
         <el-divider v-if="index !== 0" direction='vertical'></el-divider>
         <span :style="opitem.style">{{ item[opitem.label] }}</span>
@@ -53,10 +57,7 @@ const props = defineProps({
 
 const emit = defineEmits(['method', 'change', 'focus'])
 
-let modelObj = $ref({
-  value: '',
-  label: '',
-})
+let modelObj = $ref(null)
 let xcselect = $ref()
 let optionList = $ref([])
 const colorList = {
@@ -67,19 +68,18 @@ const colorList = {
   'warning': '#E6A23C'
 }
 
-const changeStaff = (val) => {
-  props.modelValue[props.name[0]] = modelObj.value
-  props.modelValue[props.name[1]] = modelObj.label
-  emit('change', props.data.find((i) => i.code === modelObj.value))
+const changeStaff = () => {
+  nextTick(() => {
+    props.modelValue[props.name[0]] = xcselect?.selected?.value
+    props.modelValue[props.name[1]] = xcselect?.selected?.currentLabel
+  })
+  emit('change', props.data.find((i) => i.code === modelObj))
 }
 
 const clear = () => {
-  modelObj = {
-    value: '',
-    label: '',
-  }
-  props.modelValue[props.name[0]] = ''
-  props.modelValue[props.name[1]] = ''
+  modelObj = null
+  props.modelValue[props.name[0]] = null
+  props.modelValue[props.name[1]] = null
 }
 
 const xcMethod = debounce(value => {
@@ -100,39 +100,19 @@ const getFocus = () => {
  *
  */
 watch(() => props.modelValue[props.name[0]], () => {
-  modelObj = {
-    value: props.modelValue[props.name[0]],
-    label: props.modelValue[props.name[1]],
+  modelObj = props.modelValue[props.name[0]]
+  let len = props.data.length
+  if (len === 0) {
+    method(modelObj)
   }
-  let code = props.modelValue[props.name[0]]
-  if (!updateData()) {
-    if (stringNotBlank(code)) {
-      method(code)
+  for (let i = 0; i < len; i++) {
+    if (modelObj === props.data[i].code) {
+      return
     }
   }
+  method(modelObj)
 })
 
-watch(() => props.data, () => {
-  updateData()
-})
-
-const updateData = () => {
-  let code = props.modelValue[props.name[0]]
-  if (stringNotBlank(code)) {
-    let codeList = props.data.find((i) => i.code === code)
-    if (typeof codeList !== 'undefined') {
-      modelObj = {
-        value: codeList.code,
-        label: codeList.name,
-      }
-      props.modelValue[props.name[0]] = modelObj.value
-      props.modelValue[props.name[1]] = modelObj.label
-      return true
-    }
-    return false
-  }
-}
-
 const method = (value) => {
   emit('method', value)
 }
@@ -148,10 +128,10 @@ const blur = () => {
 defineExpose({focus, blur})
 
 onMounted(() => {
-  modelObj = {
-    value: props.modelValue[props.name[0]],
-    label: props.modelValue[props.name[1]],
-  }
+
+  nextTick(() => {
+    modelObj = props.modelValue[props.name[0]]
+  })
 
   // 判断组件是否使用了 slot
   if (!!useSlots().default) {