自定义el-select赖加载数据指令

1.创建directives.js，放在utils文件夹下

import Vue from 'vue'
Vue.directive('loadmore', {
  bind(el, binding) {
    const SELECTWRAP_DOM = el.querySelector('.el-select-dropdown .el-select-dropdown__wrap')
    SELECTWRAP_DOM.addEventListener('scroll', function() {
      /**
      * scrollHeight 获取元素内容高度(只读)
      * scrollTop 获取或者设置元素的偏移值,常用于, 计算滚动条的位置, 当一个元素的容器没有产生垂直方向的滚动条, 那它的scrollTop的值默认为0.
      * clientHeight 读取元素的可见高度(只读)
      * 如果元素滚动到底, 下面等式返回true, 没有则返回false:
      * ele.scrollHeight - ele.scrollTop === ele.clientHeight;
      */
      const CONDITION = this.scrollHeight - this.scrollTop <= this.clientHeight
      if (CONDITION) {
        binding.value()
      }
    })
  }
})

2、在main.js中全局引用：import ‘@/utils/directives.js’或者局部使用再引入
3、开始使用,methods拉到底会打印，可以做之后的业务操作

<el-select
  v-model="value"
  :loading="isloading"
  :placeholder="place"
  :filterable="filterable"
  :disabled="isdisabled"
  :value-key="keyval"
  :style="wh==0?'':'width:'+wh+'px'"
  @input="change"
  v-loadmore="loadMoreFun"
>
  <el-option
    v-for="item in opt"
    v-if="opt.length>0"
    :key="item[keyval]"
    :label="item[name]"
    :value="item"
  />
</el-select>