ElementUI Select选择器多选获取选中对象
在ElementUI的Select组件中,如果你想获取多选框中被选中的对象,你可以使用multiple-limit
属性来设置最多可选择的项目数,并通过v-model
绑定一个数组来获取所有选中项的值。
以下是一个简单的例子,演示如何在ElementUI的Select组件中实现多选并获取选中的对象:
<template>
<el-select v-model="selectedValues" multiple placeholder="请选择">
<el-option
v-for="item in options"
:key="item.value"
:label="item.label"
:value="item">
</el-option>
</el-select>
</template>
<script>
export default {
data() {
return {
selectedValues: [],
options: [
{ value: '1', label: '选项1' },
{ value: '2', label: '选项2' },
{ value: '3', label: '选项3' },
// 更多选项...
]
};
}
};
</script>
在这个例子中,selectedValues
是一个数组,用来存储所有选中的对象。options
是一个包含所有下拉选项的数组,每个选项是一个对象,包含value
和label
两个属性。
当用户选择选项时,selectedValues
数组会被更新,包含所有选中的对象。这样你就可以访问这些对象的属性,例如selectedValues[0].value
来获取第一个选中项的值。
评论已关闭