ElementUI 中控件 Select 大数据量渲染处理

问题:element UI  中  select  数据量太大,渲染太慢怎么处理?

处理方式:

 <el-select v-model="ruleForm.animalOwnerId" filterable style="100%;" placeholder="请选择养殖户" clearable :filter-method="animalOwnerD">
            <el-option v-for="item in ownerTop200" :key="item.value" :label="item.name" :value="item.value"></el-option>
   </el-select> 
 
methods:
{
   //ownerList 大数据量集合
   //ownerTop200大数据量中前200条记录
//超过200条记录后结果查询
 animalOwnerD(query=""){
      let arr = this.ownerList.filter(item => {
          return item.name.includes(query);
      });
      if (arr.length > 200) {
          this.ownerTop200= arr.slice(0, 200);
      } else {
          this.ownerTop200= arr;
      }
    },
//接口返回大数据量集合
  getOwnerList(orgParmars).then(data => {
        this.ownerList = data;
        this.ownerTop200= data.slice(0, 200);
      });
 
}
原文地址:https://www.cnblogs.com/wu-peng/p/13678743.html