ElementUI select下拉框模糊搜索，选择下拉选项后，如何自动清除手动输入的内容呢？

问题描述：

有时候会有这样的一个需求，使用elementui 的select组件，要求有远程搜索，用户输入关键字后，自动查询后端接口返回相关下拉数据，当用户点击所需的下拉项后，要自动清除之前手动输入的内容，这样用户就可以继续手动输入新的内容来搜索新的下拉选项，elementUI的select组件，是当你选择完下拉项，失去焦点后才会自动清除之前输入的内容，如下图：

 

 

解决方法：

给select组件赋予ref属性，值自己定义，如下图所示

然后在change事件中，使用this.$refs.select来选定select  dom节点，其实打印该节点信息，会返回出一大串数据，其中有一个属性是query，可以看到它的值就是我们手动输入的内容，那么就手动将它的值置空，看看效果怎样

 

当选择下拉选项时，已经自动清空之前手动输入的内容啦！