跳转到内容

自动补全 AutoComplete

自动补全的基础用法

自定义弹出框的页脚

可以通过 dropdown-scroll 监听下拉菜单的滚动事件。或者通过 dropdown-reach-bottom 监听下拉菜单滚动到底部的事件。

使用 strict 属性来指明在匹配时严格区分大小写。

当前示例可以直接切换“默认固定高度”和“显式 itemSize”两种写法,适合对照迁移后推荐的最简配置。对于自动补全面板,通常不需要单独切到动态模式,除非选项内容会出现明显的多行高度变化。

通过 virtual-list-props 开启虚拟列表。AutoComplete 的下拉项当前默认按固定高度处理:如果你没有显式传 itemSizeminItemSize,组件会按 36px 选项高度补齐固定模式;如果要手动指定固定高度,请传 itemSize;只有显式传 minItemSize 时,才会切到动态高度模式。完整参数与迁移映射见 虚拟列表迁移指南

参数名描述类型默认值版本
model-value (v-model)绑定值string-
default-value默认值(非受控模式)string''
disabled是否禁用booleanfalse
data用于自动提示的数据(string | number | SelectOptionData | SelectOptionGroup)[][]
popup-container弹出框的挂载容器string | HTMLElement | null | undefined-
strict是否为严格校验模式booleanfalse
filter-option自定义选项过滤方法FilterOptiontrue
trigger-propstrigger 组件属性TriggerProps-2.14.0
allow-clear是否允许清空输入框booleanfalse2.23.0
virtual-list-props传递虚拟列表属性,传入此参数以开启虚拟滚动。迁移说明与完整参数VirtualListProps-2.50.0
事件名描述参数版本
change绑定值发生改变时触发value: string
search用户搜索时触发value: string
select选择选项时触发value: string
clear用户点击清除按钮时触发ev: Event2.23.0
dropdown-scroll下拉菜单发生滚动时触发ev: Event2.52.0
dropdown-reach-bottom下拉菜单滚动到底部时触发ev: Event2.52.0
方法名描述参数返回值版本
focus使输入框获取焦点--2.40.0
blur使输入框失去焦点--2.40.0
插槽名描述参数版本
option选项内容data: OptionInfo2.13.0
footer弹出框的页脚-