文章参考
问题描述
工作中,遇到一个表单输入的问题,用户要输入公司名称,因此就需要从后台获取关联信息,由于公司信息很多,后台也没有办法完全穷尽,因此返回的提示信息也不全,综合考虑,该字段的最终录入方式 —— 后台提醒 + 用户自己输入
思考过程说明
-
第一种方案:
如果是要根据用户输入关键字搜索信息,选择用户信息,最常用的就属于 select filter 组件,问题是改组件无法获取用户输入的值,一旦失焦,就会清空用户输入的值 -
第二种方案:
依然是使用 element-ui 的select组件,利用filter remote 和 “创建条目”的组合功能(想着复杂,还没有来得及验证) -
第三种方案:
自己写一个组件 -
第四种方案:
利用 element-ui 的 input 组件中的 <el-autocomplete>组件;用户输入会自动根据后台搜索的数据显示出联想内容,就算没有搜索到关键字,依然可以获取到用户的输入
解决方案
利用 element-ui 的 input 组件中的 <el-autocomplete>组件