vue+element项目,select组件搜索改变下拉部分选项之后,再次搜索出现键盘上下选择选项时无法按照列表顺序选择怎么办?

vue+element项目
select组件搜索改变下拉部分选项之后,再次搜索出现键盘上下选择选项时无法按照列表顺序选择,而是变成列表顺序还是正常的,但是用键盘的上下选择选项时,会跳过上次搜索出的那项数据,等选择完其他的之后再跳到上次搜索的数据上
尝试过清空搜索出的列表,但是没有用,也看了搜索之后data中列表顺序是对的,但是就是上下键选择时不对,也不报错
相关代码
v-model="searchGoodsBatchData"
:filter-method="filterGoodsBatchData"
filterable
default-first-option
placeholder="请输入产品名"
@change="searchGoods"
@keyup.native="showGoodsBatch($event)"
:disabled="searchBoxDisable"
popper-class="searchGoodsBatchInput"
id="searchGoodsBatchInput"
ref="searchGoodsBatchInput"
v-focus="false"clearable>
class="searchGoodsOption"
v-for="itemingoodsListData"
:key="item.commodityCode"
:label="item.name"
:value="item.commodityCode"
v-show="showGoodsBatchOption"
>
{{item.commodityCode}}
{{item.SixNineCode}}
{{item.name}}
{{item.manufactor}}
js部分
filterGoodsBatchData(v){
this.searchGoodsBatchData=v
this.goodsListData=[]
console.log('搜索之前先清空',this.goodsListData)
this.goodsListData=this.copyGoodsListData.filter((item)=>{
constval=v.toLowerCase()
if(item.commodityCode.indexOf(val)!==-1)returntrue
if(item.SixNineCode.indexOf(val)!==-1)returntrue
if(item.name.indexOf(val)!==-1)returntrue
if(item.manufactor.indexOf(val)!==-1)returntrue
})
console.log('搜索之后',this.goodsListData)
},
请问各位这是要怎么才能解决呢?
百度了两天了都没找到对应的答案
鸿蒙传说
浏览 1932回答 2
2回答

慕村9548890

这个是Element-UISelect组件自身的bug,它官方网站给出的案例也是这样的情况,建议自己封装组件实现特殊功能,灵活性更大。

catspeake

你需要设置个中间变量来接收你搜索的值,你的原始数据是不能动的{{item.username}}{{item.userId}}userFilter(query=""){letarr=this.dataList.filter(item=>{return(item.username.indexOf(query)!=-1||item.userId.indexOf(query)!=-1);});this.userDataTemp=arr;},
打开App,查看更多内容
随时随地看视频慕课网APP

相关分类

JavaScript