前端vue框架select下拉数据量过大造成卡顿问题解决办法

<a-select label-in-value :default-value="{ key: 'lucy' }" style="width: 120px" @change="handleChange" @popupScroll="handldpopupscroll" ><a-select-option></a-select-option></a-select>

//每次滚动触发
handldpopupscroll(e){
//向下滚动时，判断e.target.scrollHeight(实际下拉列表高度)-e.target.clientHeight（可视框高度)==e.target.scrollTop（卷起的高度）
if(e.target.scrollHeight-e.target.clientHeight==e.target.scrollTop){
//(指向下一个分组数据)
this.scrollPage++
//第一个位置=当前分组数据*每组数据的数量
let beforts=this.scrollNumber*(this.scrollPage-1)
//第二个位置=下一个分组指向*每组数据的数量-1
let afters=this.scrollNumber*this.scrollPage-1
展示数组=原数组.slice(第一个位置，第二个位置)
//(使滑块位置不置于最上面，才能向上滑动)
e.target.scrollTop=5
//为了防止滑块滑动太快将以上加在延时器里面,不然数据会跳
}
//向上滚动时，判断e.target.scrollTop（卷起的高度小于1）和this.scroPage指向下一个分组数据的角标大于1
if(target.scrollTop<1&&this.scroPage>1){
//(指向上一个分组数据)
this.scrollPage--
//第一个位置=当前分组数据*每组数据的数量
let beforts=this.scrollNumber*(this.scrollPage-1)
//第二个位置=下一个分组指向*每组数据的数量-1
let afters=this.scrollNumber*this.scrollPage-1
展示数组=原数组.slice(第一个位置，第二个位置)
//判断是否是第一组数据
if(this.scrollPage!=1){
//(使滑块位置不置于最上面，才能向上滑动)
e.target.scrollTop=5
}
//为了防止滑块滑动太快将以上加在延时器里面,不然数据会跳
}
}