鼠标滚动分页查询:
main.js文件中引入:
main.js部分
Vue.directive('loadmore', {bind (el, binding) {// 获取element-ui定义好的scroll盒子const SELECTWRAP_DOM = el.querySelector('.el-select-dropdown .el-select-dropdown__wrap')SELECTWRAP_DOM.addEventListener('scroll', function () {const CONDITION = this.scrollHeight - this.scrollTop <= this.clientHeightif (CONDITION) {binding.value()}})}})
html部分
<el-select class="userIdList" v-model="parameter.userId" filterable:placeholder="$store.state.isChinese ? '请选择用户' : 'Please select user'" size="mini"v-loadmore="loadMore" clearable><el-option v-for="item in chatmodes" :key="item.id" :label="item.nickname" :value="item.id"></el-option></el-select>
js部分
getUserIdList() {util.post(`/api/translate-client/tran/getUserByCondition?page=${this.parameter.page}&pageSize=${this.parameter.pageSize}`).then((response) => {if (response.code === 100) {let responseArr = response.entity.list || []this.chatmodes = [...this.chatmodes, ...responseArr];}});},// 无线加载loadMore() {this.parameter.page += 1;this.getUserIdList()},