element el-select 在原有基础上修改选中得数据

最新推荐文章于 2025-07-28 13:25:42 发布

原创最新推荐文章于 2025-07-28 13:25:42 发布 · 1.5k 阅读

2 ·

CC 4.0 BY-SA版权

文章标签：

#vue.js #前端 #javascript

文章介绍了如何利用ElementUI的el-autocomplete组件创建一个既可搜索又可选择输入的表单字段。通过设置v-model、fetch-suggestions、debounce等属性，以及自定义模板插槽来增强用户体验，同时在select事件中处理用户的选择操作。

element el-autocomplete 组件就可以实现可选择可输入


<el-autocomplete
popper-class="my-autocomplete"
v-model="item.plateNum"
disabled="item.parkstatus !=1"
fetch-suggestions="querySearch"
debounce="0"
placeholder="请输入或选择内容”
@select="handleSelect(index,$event)"
><i class="el-icon-edit el-input icon"slot="suffix"></i>
<template slot-scope="{item }"
<div class="name">{{item }}</div>
</template>
</el-autocomplete>