el-select element 可自定义输入的可搜索下拉框

描述: 用户可自定义输入要查询的文件格式，也可根据下拉列表选择文件格式，并且在用户输入的同时，具有搜索功能。

实现步骤：

1.使用element-ui组件的 el-select标签  并且配置上filterable 可搜索属性

2.给el-select标签手动绑定blur事件，并且手动赋值给el-select标签的v-model

selectBlur(e) {
      this.searchForm.fileExt = e.target.value
    },

3.在此处有个bug，如果浏览器有点小卡的话，会出现手动输入的值绑定不上el-select  v-model的现象，因为没有可配置项，失焦或者重新聚焦（点击）的时候会自动清除v-model绑定的数据。所以需要将绑定事件“@blur”后面加上“.native”；完美解决。

注意：如果以上两种方法都无法解决  或者不能满足项目需求，那么请在el-select 组件中  加入filter-method属性，可以即时获取当前变化的值，效果参考原生change 事件，但是这样会破坏默认的模糊搜索功能，需要手动自己添加搜索规则。

如（未添加规则）：

filterData(e) { //值改变判断
      this.searchData = e
      if (e != this.historyVal) {
        this.key = true
      }
    },

 

4.如需要在下拉选项中创建自定义输入值的选项，需要在el-select标签上添加属性allow-create，以允许允许用户创建新条目。

效果如图（非创建新条目）：