element ui 表单提交多选传直
时间: 2023-10-06 07:06:34 浏览: 119
Element-ui 多选.md
element ui 表单提交多选传值的方法是使用表单中的 el-select 组件,并设置 multiple 属性为 true,这样就可以实现多选功能。在提交表单时,可以通过 v-model 指令绑定选中的值到数据对象中。例如:
```html
<el-form>
<el-form-item label="多选下拉框">
<el-select v-model="selectedOptions" multiple>
<el-option v-for="option in options" :key="option.value" :label="option.label" :value="option.value"></el-option>
</el-select>
</el-form-item>
<el-button type="primary" @click="submitForm">提交</el-button>
</el-form>
```
在 Vue 的实例中,定义 selectedOptions 数据来存储选中的值,然后在 submitForm 方法中处理提交逻辑:
```javascript
data() {
return {
selectedOptions: [],
options: [
{ value: 'option1', label: '选项1' },
{ value: 'option2', label: '选项2' },
{ value: 'option3', label: '选项3' }
]
}
},
methods: {
submitForm() {
// 提交表单逻辑,可以使用 this.selectedOptions 来获取选中的值
}
}
```
阅读全文