Vue Element-UI下拉框搜索功能
2020-11-11 本文已影响0人
逆风g
要实现这样的功能：
上代码：
<el-select v-model="form.data.eqNo" filterable :filter-method="dataFilter" @click.native="eqNoClick">
<el-option
v-for="equipment in showEquipments"
:key="equipment.eqNo"
:label="equipment.eqName"
:value="equipment.eqNo"
/>
</el-select>
- 核心：给下拉框新增加属性 filterable :filter-method=dataFilter
//下拉框开启搜索功能
dataFilter(val){
if(val){
this.showEquipments =this.equipments.filter((item=>{
return item.equipments.includes(val)
}))
}else{
this.showEquipments=this.equipments
}
},
- 一定要添加这方法，不然下次点击时，下拉框的默认数据为上一次筛选后的数据：
eqNoClick(){
this.showBankNames = this.bankNames
},
