el-select 实现分页加载,切换也数滚回到顶部,自定义高度

1.html
<el-form-item label="俱乐部:" prop="club_id" label-width="120px"><el-select :disabled="Boolean(match_id)" style="width: 100%" v-model="matchForm.club_id"placeholder="请输入搜索或选择" filterable remote popper-class="eloption" :remote-method="remoteMethods":loading="loading"><el-option v-for="item in clubList" :key="item.club_id" :label="item.club_name" :value="item.club_id"></el-option><!-- 分页器 --><div class="flex justify-center flexac"style="position: sticky; bottom: 0; background: white; z-index: 1; padding: 0 0;"><pagination v-model:page="searchForm.page" v-model:limit="searchForm.list_rows" :total="total"@pagination="myClub" layout="prev, pager, next, jumper" /></div></el-select></el-form-item>
2.功能 js
1. 切换回到顶部nextTick(() => {const dropdown = document.querySelector('.el-select-dropdown .el-scrollbar__wrap');if (dropdown) {dropdown.scrollTop = 0;}});2.搜索方法
const remoteMethods = (query) => {searchForm.value.page = 1;searchForm.value.keyword = query;getdata();
};
3.样式
// 高度
<style>
.eloption .el-select-dropdown__wrap {max-height: 500px !important;
}
</style>