社交网站建设计划书,怎么建网站站点,个人网站备案描述,虚拟资源下载主题wordpress项目中需要实现搜索框搜索时能自动提示可选项的功能#xff0c;elementui的input组件有已经封装好的el-autocomplete可以使用#xff0c;但是在使用中发现一些问题#xff0c;记录一下
基础使用
// html部分
el-autocompletev-modelname:fetch-suggestion…项目中需要实现搜索框搜索时能自动提示可选项的功能elementui的input组件有已经封装好的el-autocomplete可以使用但是在使用中发现一些问题记录一下
基础使用
// html部分
el-autocompletev-modelname:fetch-suggestionsquerySearchAsyncplaceholder请输入关键词value-keyname:trigger-on-focusfalsepopper-classautocompletePopper:popper-append-to-bodyfalseclassmy-autocomplete/el-autocomplete// js部分querySearchAsync (queryStr, cb) {// 异步调用接口逻辑let results 调用接口返回的数据中筛选出来的结果cb(results)},自定义选项
// html部分
el-autocompletev-modelname:fetch-suggestionsquerySearchAsyncplaceholder请输入关键词value-keyname:trigger-on-focusfalsepopper-classautocompletePopper:popper-append-to-bodyfalseclassmy-autocompletetemplate slot-scope{ item }div classcustom-item :titleitem.name{{ item.name }}/div/template/el-autocomplete// js部分querySearchAsync (queryStr, cb) {// 异步调用接口逻辑let results 调用接口返回的数据中筛选出来的结果cb(results)},需要注意的点
1、value-keyname不能少如果缺失会导致点击数据下拉选项后输入框无法赋值的情况 2、v-modelname不能少如果缺失会导致输入框无法赋值的情况 3、自定义选项需要注意slot-scope的参数就是item
