当el-select数据超过1000条,页面就会出现明显卡顿。此时的优化方案除了后台接口分页,前台也可以自行数据分页:
<el-select filterable v-model.trim="formInline.storeId" :placeholder="$t('SearchNameAll.PleaseChoose')" @change="getfilelist(1)"
v-el-select-loadmore="loadmore">
<el-option v-for="storeid in storeidlist" :key="storeid.id" :label="storeid.storeName" :value="storeid.storeId" ></el-option>
</el-select>
初始化:
data(){
return{
storeidlist:[],
storelistpage:{
size:200,
cur:1,
},
}
},
mounted(){
this.$refs.getPermissions.getDataPermissions();
this.storeidlist = this.$store.state.storeidlist.slice(0,200);
this.formInline.storeId = this.$store.state.storeIDselect001;
}
当页面下拉选项滚动时:
export default{