element ui 下拉框加載事件寫法

根據搜索條件去分頁加載選項列表，可以寫如下的指令

directives: {
    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.clientHeight;
          if (CONDITION) {
            binding.value();
          }
        });
      }
    }
  },
  
  使用的時候  
  
  <el-select
    v-loadmore="loadData"
  >
    <el-option
      v-for="(item,index) in list"
      :key="index"
      :label="item.label"
      :value="item.value"
    ></el-option>
  </el-select>
  
  
  
     async loadData() {
      this.page++;
      await this.getList;
    },
    

但是要注意的問題是第一次加載的數據不要過多，不然element ui的這樣式就出不來滾動條了，
還要自己去修改樣式，我的這個實驗的是每次一頁10條去加載的，方案可行還要自己去修改樣式，
我的這個實驗的是每次一頁10條去加載的，方案可行