视频格式:'video/mp4', 'video/avi', 'video/mov', 'video/wmv', 'video/flv', 'video/ts'
视频格式校验以及空文件校验:
javascript
<el-form-item label="视频选择" prop="fileList">
<el-upload
style="width: 200px"
ref="uploadRef"
action=""
accept=".mp4.avi.mov.wmv.flv.ts"
v-model:file-list="formModel.fileList"
:limit="1"
:http-request="handlerUpload"
:headers="headers"
:on-success="handleSuccess"
:before-upload="beforeAvatarUpload"
>
<el-button type="primary">选择文件</el-button>
</el-upload>
</el-form-item>
javascript
const beforeAvatarUpload = (rawFile) => {
let typeList = ['video/mp4', 'video/avi', 'video/mov', 'video/wmv', 'video/flv', 'video/ts']
if (!typeList.includes(rawFile.type)) {
proxy.$modal.msgError('请上传视频文件!')
return false
} else if (rawFile.size / 1024 / 1024 <= 0) {
proxy.$modal.msgError('请勿上传空文件!')
return false
}
return true
}
图片格式 、空文件、重复上传校验:
javascript
<el-form-item label="海报选择">
<el-upload
style="width: 200px"
ref="imgUploadRef"
action=""
multiple
:file-list="imgList"
accept=".jpg,.png,.jpeg"
:http-request="handlerIMGUpload"
:headers="headers"
:before-upload="imgBeforeAvatarUpload"
>
<el-button type="primary">选择图片</el-button>
</el-upload>
</el-form-item>
javascript
const imgBeforeAvatarUpload = (rawFile, file) => {
if (
rawFile.type !== 'image/jpeg' &&
rawFile.type !== 'image/png' &&
rawFile.type !== 'image/jpg'
) {
proxy.$modal.msgError('请上传图片文件!')
return false
} else if (rawFile.size / 1024 / 1024 <= 0) {
proxy.$modal.msgError('请勿上传空文件!')
return false
} else {
let newFilelist = imgList.slice(0, imgList.length - 1)
if (newFilelist.some((item) => item.name == rawFile.name)) {
proxy.$modal.msgError('请勿重复上传!')
return false
}
}
return true
}