vue项目中，element-ui select 的下滑加载更多

需求背景：我司的一个需求，在一个下拉框要显示艺术家，但是艺术家太多，如果一下子请求回来，接口返回很慢，渲染也很慢，所以想到的解决方案是分页请求，当鼠标在select 的option中滑动超过option的高度，就会触发一个事件，然后调用自己的函数，代码如下：
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 就是你的逻辑

       // 你的代码
 

3 loadmore 中写自己的逻辑

这样，当鼠标滑到 option 下面的时候，就会触发 loadmore 函数，就可以实现鼠标下拉加载更多。