iview的Select组件远程搜索的BUG优化--以及JS函数节流的应用

1. 业务场景：模糊搜索姓名，点击选择

2. 示例代码
 

template:
<Select  @on-change='check' filterable remote :remote-method='fuzzySearch' :loading="loading1" placeholder='请输入姓名'>
          <Option v-for="item in employeeList" :key="item.manageId" :value="item.manageId">{{item.manageName}}</Option>  </Select>
 js:
 //模糊查询
    fuzzySearch(keyword) {
    //利用函数节流可以大大减少没必要的多次请求
      clearTimeout(this.fuzzySearch.timer)
      //避免空格、选择之后再调一次接口（iview默认选择完成还会掉一次接口，浪费，必须干掉）
      if (keyword.trim() && this.employeeList.every(item => item.manageName !== keyword)) {
        this.fuzzySearch.timer = setTimeout(() => {
          this.loading1 = true;
          //请求接口
          this.api.get('dimission/findManage', { keyword }).then(res => {
            if (res.state === 200) {
              this.loading1 = false
              this.employeeList = res.data
            } else {
              this.$Notice.error({ title: res.msg })
            }
          })
        }, 800)
      }
    }

原文：https://blog.csdn.net/weixin_43206949/article/details/84566847