el-select表单验证必填
时间: 2023-11-05 09:05:32 浏览: 75
可以通过给 el-select 组件设置 rules 属性来实现表单验证必填。具体做法如下:
在 el-select 组件中添加 ref 属性,如下所示:
```
<el-select v-model="selectedItem" ref="mySelect">
...
</el-select>
```
在表单的 data 中添加校验规则,如下所示:
```
data() {
return {
selectedItem: '',
rules: {
selectedItem: [
{ required: true, message: '请选择选项', trigger: 'blur' }
]
}
}
}
```
在表单中添加 el-form 组件,并给它设置 ref 属性,如下所示:
```
<el-form ref="myForm" :model="form" :rules="rules">
<el-form-item label="选项名称" prop="selectedItem">
<el-select v-model="selectedItem" ref="mySelect">
...
</el-select>
</el-form-item>
</el-form>
```
在提交表单时调用 el-form 的 validate 方法进行校验,如下所示:
```
this.$refs.myForm.validate((valid) => {
if (valid) {
// 校验通过
} else {
// 校验不通过
}
});
```