The elementui select can be selected from the drop-down box and can be entered (no need to click Enter, no additional operations are required)

Looking at the documentation, we know that this property can be set to true, and you can enter it yourself in the drop-down box

<el-select
     v-model="form.pcode"
     clearable
     filterable
     placeholder="请选择产品"
     class="product-input"
     allow-create
 >
     <el-option
         v-for="(item,index) in arr_product"
         :key="index"
         :label="item.label"
         :value="item.value"
     />
 </el-select>

Originally, the above two attributes have been satisfied, but in actual operation, you need to click or press Enter after entering the content to confirm, otherwise the input content will be gone, as follows (press Enter, or click 1223 in the drop-down box, The input box is determined, which is extremely inconvenient):

So in order to solve this problem, we use the blur method:

<el-select
   v-model="form.pcode"
   clearable
   filterable
   placeholder="请选择产品"
   class="product-input"
   @blur="productSelect"
   allow-create
>
   <el-option
       v-for="(item,index) in arr_product"
       :key="index"
       :label="item.label"
       :value="item.value"
   />
</el-select>




productSelect(e) {
    
    
     let value = e.target.value; // 输入框值
      if(value) {
    
     // 你输入才有这个值 不为空，如果你下拉框选择的话 这个值为空
          this.form.pcode = value
      }
  }

Use a @blur method to lose focus and enter the value without additional carriage return or click