不让el-autocomplete触发fetch-suggestions事件
如果不想让el-autocomplete组件触发fetch-suggestions事件,可以通过设置trigger-on-focus属性来实现。
trigger-on-focus属性是el-autocomplete组件的一个参数,它控制着当input获得焦点时是否自动触发数据查询。将trigger-on-focus属性设置为false后,el-autocomplete就不会在输入框获得焦点时自动触发fetch-suggestions事件了。
<el-autocomplete
v-model="value"
:fetch-suggestions="querySearchAsync"
:trigger-on-focus="false">
<template slot-scope="{ item }">{{ item.value }}</template>
</el-autocomplete>
取消搜索功能,点击输入框展示全部数据
调接口时把word:queryString去掉,就不会触发搜索关键词的功能,前提是后端接口有搜索字段!
// 有搜索关键词功能
querySearchList(queryString, cb, type) {
if (type == "shop") {
getShopList({word:queryString, page: 1, limit: 999, isShowBlock: 0 }).then((res) => {
cb(res.list);
});
}
}
// 没有搜索关键词功能
querySearchList(queryString, cb, type) {
if (type == "shop") {
getShopList({ page: 1, limit: 999, isShowBlock: 0 }).then((res) => {
cb(res.list);
});
}
}
下拉框每次点击都会抖动一下才会展示数据
加属性 debounce(获取输入建议的去抖延时)。debounce 的默认值是 300ms,将其设置为 0ms。
<el-autocomplete
placeholder="请输入DEVEUI"
v-model="searchDeveuiVal"
clearable
:fetch-suggestions="querySearch"
size="small"
:debounce=0
@keyup.enter.native="searchAppNode">
</el-autocomplete>
参考:element-ui带输入建议的input框踩坑(输入建议空白以及会闪出上一次的输入建议问题)_element input光标闪烁-CSDN博客