关于element-ui:elementUI中form表单验证upload上传相关问题

29次阅读

共计 755 个字符,预计需要花费 2 分钟才能阅读完成。

实例代码:上传图片是必填项,加 refprop

<el-form-item label="整改前现场照片" ref="beforeImg" prop="imageUrl">
    <el-upload
       ref="upload"
       action="/webCenter/file/api/uploadAttachment"
       multiple
       :on-preview="handlePictureCardPreview"
       :on-remove="handleRemove"
       :on-success="fileUploadSuccess"
       :before-upload="beforeUpload"
       :data="fileData"
       :show-file-list=false
       accept="image/*"
    >
        <el-button size="small" type="primary"> 点击上传 </el-button>
    </el-upload>
</el-form-item>

问题 1:在上传图片后还是会呈现提醒音讯

fileUploadSuccess(res) {this.$refs.beforeImg.clearValidate()
    this.$message.success(res.msg)
}

解决:在上传胜利后,须要通过 this.$refs.beforeImg.clearValidate() 独自对表单项勾销验证, 这样提醒音讯就会隐没。

问题 2:曾经上传图片,但在提交表单时,验证规定还是不通过,显示为 false

解决:在提交表单或者在关上表单之前,对上传文件列表是否有值进行判断,若有值,则勾销校验。

import _ from "lodash";
if (this.filelist.length) {_.unset(this.rules, ["imageUrl"]);
}
正文完
 0