效果图如下：
<el-form-item label='所属角色:' prop='roleName'>
<el-autocomplete
@keyup.enter.native='searchList'
suffix-icon='el-icon-arrow-down'
v-model='search.roleName'
placeholder='请选择或输入'
:fetch-suggestions='querySearchRoleName'
value-key='roleName'
value='roleName'
>
</el-autocomplete>
</el-form-item>
/**
* @description 返回输入建议的方法
* @author 饺子
* @param { String } queryString 输入的字符
* @param { Function } cb 回调函数（返回建议列表的数据）
*/
querySearchRoleName(queryString, cb) {
const roleList = this.roleList // 下拉框的数据列表
const results = queryString ? roleList.filter(this.createFilter(queryString)) : roleList
// 调用 callback 返回建议列表的数据
cb(results)
},
/**
* @description 筛选包含字符的列表
* @author 饺子
* @param { String } queryString 输入的字符
*/
createFilter(queryString) {
return (role) => {
return (role.roleName.toLowerCase().indexOf(queryString.toLowerCase()) !== -1)
}
},
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 举报，一经查实，本站将立刻删除。
文章由极客之音整理，本文链接：https://www.bmabk.com/index.php/post/64743.html
