需求:比如表单有个上传文件的字段,这个字段设置为必填,之前未上传,点击提交,然后出现字段不能为空的提示,然后上传文件,上传完成后,之前提示依然存在,现在需要在上传成功后把这个提示去掉,这就需要在上传文件的handleSuccess方法中手动触发该表单字段的校验,因为已经不是空了,所以触发校验后提示会自动消失。
实现:
form按如下写法:
<Form ref="editForm" :rules="ruleInline" :model="formData" class="editable" :label-width="150" >
handleSuccess函数中按如下写法:
handleSuccess (res, file) {
if (res.code === 0) {
this.uploadData.showUploadFile = true;
this.formData.filePath = res.content;
this.$refs.editForm.validateField('filePath');
}else{
this.$Message.error(res.message);
}
}
主要是这一句:
this.$refs.editForm.validateField('filePath');
ref editForm 这个form上也对应写好