vue3自定义指令实现el-select下拉加载更多
1. 新建js文件 export default (app) => { app.directive('loadmore', { beforeMount(el, binding) { const element = el.querySelector('.t-select__dropdown'); element.addEventListener('scroll', () => { const { scrollTop, scrollHeight, clientHeight } = element; const scrollDistance = scrollHeight - scrollTop - clientHeight; if (scrollDistance <= 0) { binding.value(); } }); }, }); };
2. mian.js注册 import drgDirectives from './utils/directive/loadmore'; drgDirectives(app);
3. 使用 <el-select v-model="val" v-loadmore="loadmore" filterable :options="options" clearable />
const loadmore = () => {
console.log('触底的时候触发loadmore');
};