直接输入的下拉选择框

组件：arco design

框架： vue3

                 <a-form-item field="inputCode" :rules="rules.inputCode">
                    <template #label>
                      <span class="mr4">起始号</span>
                    </template>
                    <a-select
                      :model-value="form.inputCode || cloneInputCode"
                      style="width: 100%"
                      placeholder="请选择"
                      allow-create
                      allow-clear
                      @input-value-change="handleInputChange"
                      @change="handlChange"
                      @clear="handleClear"
                    >
                      <a-option
                        v-for="(item, index) of numberList"
                        :key="index"
                        :label="item.label"
                        :value="item.value"
                      />
                    </a-select>
                  </a-form-item>

​
 

 const handleInputChange = async (inputValue: any) => {
    form.value.inputCode = inputValue
    if (form.value.inputCode) {
      cloneInputCode.value = inputValue
    }
    const valid = await formRef.value?.validateField('number')
    if (valid) {
      form.value.inputCode = undefined
      cloneInputCode.value = undefined
    }
  }
​
  const handlChange = async (inputValue: any) => {
    form.value.number = inputValue
    if (form.value.inputCode) {
      cloneInputCode.value = inputValue
    }
    const valid = await formRef.value?.validateField('number')
    if (valid) {
      form.value.inputCode = undefined
      cloneInputCode.value = undefined
    }
  }
​
  const handleClear = () => {
    form.value.number = ''
    cloneInputCode.value = ''
  }

实现的交互：在下拉框中输入数据后不用选择，下拉框的值就发生改变