实现下拉列表+和输入文本模糊匹配功能

需求：我想实现一个下拉列表同时又能够根据输入的文字进行查询。

方法：

<el-col :span="10">
   <el-form-item label="姓名" prop="name">
   <el-select v-model="ruleForm.name" filterable placeholder="请选择" @query-search="handleSearch">
   <el-option v-for="item in Name" :value="item"></el-option>
   </el-select>
   </el-form-item>
</el-col>

methods:{
    handleSearch(query) {
      this.Name = this.Name.filter(item => item.includes(query));
    }
}

<!--        
其中Name是一个列表格式为：
const Name = ["张三","李四","王五"]

v-for 这个标签就可以将Name列表中的数据，以下拉列表的方式展现出来。

filterable：实现可输入汉字

v-model:实现将输入的汉字与定义的变量进行绑定

@query-search="handleSearch" 实现了将输入的汉字进行过滤

-->
​

​