el-upload上传如何必填校验
时间: 2023-06-29 08:12:05 浏览: 277
要实现el-upload上传必填校验,可以借助于element-ui提供的rules规则属性和upload事件。
1. 在el-upload组件上添加rules属性,用于校验上传文件是否符合要求。例如,可以使用required规则来要求必须上传文件。
```
<el-upload
class="upload-demo"
action="/upload"
:rules="{ required: true }"
@submit="submitUpload">
<el-button slot="trigger" size="small" type="primary">选取文件</el-button>
<div slot="tip" class="el-upload__tip">只能上传jpg/png文件,且不超过500kb</div>
</el-upload>
```
2. 在submitUpload方法中,通过判断上传文件的数量来进行必填校验。如果上传文件数量为0,则校验未通过,需要给出提示信息。
```
methods: {
submitUpload() {
if (this.$refs.upload.uploadFiles.length === 0) {
this.$message.error('请上传文件')
return false
}
}
}
```
这样就能实现el-upload上传必填校验。需要注意的是,如果需要校验上传文件的格式和大小等其他要求,可以在rules规则属性中添加其他规则,并在submitUpload方法中进行相应的判断。