关于element-ui的采坑实录 使用心得

el-autocomplete
这个是element-ui的输入框下拉，嘛。。可以在你输入的时候出现一个下拉，进行配置的时候还可以将你输入的东西与下拉框的内容进行匹配，然后下拉框会显示匹配的内容

先来看一个实现从远程搜索的下拉筛选，看下图官网代码，:fetch-suggestions="querySearchAsync"是element-ui的原生定义函数，这里是定义下拉内容的函数方法，restaurants是下拉框的内容，timeout这个定时器使用来决定多少秒后显示筛选后的内容

<el-autocomplete
  v-model="state"
  :fetch-suggestions="querySearchAsync"
  placeholder="请输入内容"
  @select="handleSelect"
></el-autocomplete>
<script>
  export default {
   
    data() {
   
      return {
   
        restaurants: [],
        state: '',
        timeout:  null
      };
    }
}

我们继续来看相关的具体函数方法
queryString是输入的内容，cb是显示下拉的回调，需要记住几点
1.在querySearchAsync中queryString和cb这样的形参最好不要去动，防止参数错误
2.在querySearchAsync中使用 cb(results);，可以将results中的数据进行显示在下拉框中
3.createStateFilter函数是用来匹配下拉与输入内容

  querySearchAsync(queryString, cb) {
   
        var restaurants = this.restaurants;
        v