如图校验不通过的图片依然显示在预览列表了，需要在校验不通过的时候移除图片

        <el-uploadclass="upload-cls":action="ossSignature.host":auto-upload="false"ref="upload":list-type="listType":limit="limit":on-change="handleChange":on-remove="handleRemove":accept="uploadType":before-upload="beforeUpload":show-file-list="true":file-list="uploadFiles"><el-button class="float-l" size="small" type="primary">点击上传</el-button><span>&nbsp;&nbsp;{{ remark }}</span></el-upload>

由于auto-upload = false，校验没办法在beforeUpload事件里添加

最终校验逻辑加在on-change方法里，handleChange方法逻辑如下

        async handleChange(file, fileList) {var ext = this.getSuffix(file.name);if (this.uploadType.indexOf(ext) < 0) {this.handleRemove(file,fileList);this.$message.error('仅支持' + this.uploadType + '格式文件');return;}if (this.fileType == 1) {var size = file.size / 1024 / 1024;if (size > 3) {this.$message.error('图片文件大小仅支持小于3M的图片');this.handleRemove(file,fileList);return;}}if (this.fileType == 2) {var size = file.size / 1024 / 1024;if (size > 500) {this.$message.error('请上传≤500MB的视频');this.handleRemove(file,fileList);return;}}},handleRemove(file, fileList) {let index = -1;fileList.forEach((e, i) => {if (e.uid == file.uid) {index = i;}});if(index >= 0){fileList.splice(index, 1);}         }

主要是利用组件自带的on-change方法，第一个参数file代表当前上传文件，第二个参数就是文件列表对象。实现的主要逻辑就是在类型校验、文件大小限制、视频大小限制不符合的时候，根据uid找到文件index，然后从fileList从移除就好了。