ドキュメントを見ると、このプロパティを true に設定でき、ドロップダウン ボックスに自分で入力できることがわかります。
<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>
本来、上記の2つの属性は満たされていますが、実際の操作では、以下のように内容を入力した後、クリックまたはEnterキーを押して確認しないと、入力内容が消えてしまいます(Enterキーを押すか、ドロップボックスの1223をクリックします)。ダウンボックス、入力ボックスが決定され、非常に不便です):
そこで、この問題を解決するために、ぼかしメソッドを使用します。
<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
}
}
@blur メソッドを使用してフォーカスを失い、キャリッジ リターンやクリックを追加せずに値を入力します。