vue 的rule规则校验注意点
el-form 中有三个参数控制校验。注意:1)ref 的值和:model值要一致,prop和el-select中的v-model要一致。2):model 和 v-model 中的要一致。<el-form label-width="100px" :model="exportForm" :rules="exportRules" ref="exportForm"><el-form-i
·
el-form 中有三个参数控制校验。
注意:校验名和控件绑定名要配对,如checkItem
示例如下:
<el-form label-width="100px" :model="exportForm" :rules="exportRules" ref="exportForm">
<el-form-item label="检测项" prop="checkItem">
<el-select v-model="exportForm.checkItem"> </el-select>
</el-form-item>
</el-form>
其data中的定义如下:
exportForm:{
checkItem:'',
},
exportRules:{
checkItem: [
{
required: true,
message: "请输入检测项",
trigger: "change"
}
]
},
保存时校验方式如下:
exportData(){
this.$refs.exportForm.validate(
valid =>{
if (valid) {
this.$g(`exportReport`, {
...this.exportForm
}, {responseType: 'blob'}).then(
res => {
this.download(res);
}
);
}
}
)
},
更多推荐
已为社区贡献1条内容
所有评论(0)