1、首先给 el-select 绑定一个事件,这个事件 element 是不支持的,所以要自己定义一个属性:
directives: {
'el-select-loadmore': {
inserted(el, binding) {
const SELECTWRAP_DOM = el.querySelector(
'.el-select-dropdown .el-select-dropdown__wrap'
);
SELECTWRAP_DOM.addEventListener('scroll', function() {
const condition = this.scrollHeight - this.scrollTop <= this.clientHeight;
if (condition) {
binding.value(); }
});
}
}
}
2、在el-select中绑定这个属性, loadmore 就是你的逻辑
<el-select v-el-select-loadmore="loadmore">
// 你的代码
</el-select>
3、loadmore 中写自己的逻辑
当鼠标滑到 option 下面的时候,就会触发 loadmore 函数,就可以实现鼠标下拉加载更多。
此文章出自:要怎么样才能取一个独一无二的名字
原文出处链接:http://blog.csdn.net/qq_35976676/article/details/108144988