Element select下拉多选可搜索
文章描述：
element select下拉框可以搜索以及可以多选值
用法
filterable 是否可搜索
multiple 是否多选
clearable 是否可以清空选项
注意：el-select的v-model对应el-option的:key
<template>
<div style="padding: 100px;">
<el-select
id="staff"
v-model="selectedStaff"
style="min-width: 50%"
filterable
multiple
placeholder="请选择"
size="medium"
>
<el-option
v-for="option in options"
:key="option.user_id"
:label="`${option.name}-${option.code}`"
:value="option.user_id"
/>
</el-select>
<el-tooltip placement="right">
<div slot="content">注意：<br/>可以多选</div>
<i class="el-icon-info" style="color:#186ed2;padding-left: 2px">规则提示</i>
</el-tooltip>
{{selectedStaff}}
</div>
</template>
<script>
export default {
data(){
return {
options:[
{user_id:1, name:'宇智波 · 斑', code:'001'},
{user_id:2, name:'宇智波 · 鼬', code:'002'}
],
selectedStaff:''
}
},
created() {
},
methods:{
}
}
</script>
发布时间：2023/11/02
发表评论