循环el-upload上传文件失败,清除失败文件
<div v-for="(item, index) in queryChangeItemByModeIddata" :key="index" > <el-form-item :label="item.itemName" v-if="item.inputTypeId == 5" :required="item.isRequired == 1 ? true : false" style="width: 700px" > <el-upload ref="uploadFile" class="upload-demo" action="action" :auto-upload="true" :http-request="uploadOk" :on-preview="handlePreview" :on-remove="handleRemove" :before-remove="beforeRemove" :on-change="onChange" :limit="1" :on-exceed="handleExceed" :file-list="fileList" :disabled="loading" > <el-button size="small" type="primary" :disabled="loading" @click="click(index, item)" > <!-- 点击上传 --> {{ $t('info.upload') }}</el-button > <div slot="tip" class="el-upload__tip el-upload__tips" ><!-- 只支持上传一个文件,且文件须小于30M --> {{ $t('info.uploadTip') }}</div > </el-upload> </el-form-item> </div>
uploadOk(file) { let params = new FormData(); params.append('file', file.file); this.loading = true; upload(params) .then((list) => { let listData = { itemId: this.uploadId, itemDetail: list.data, itemRemark: file.file.name }; this.listDatas.push(listData); //组装数据 this.loading = false; }) .catch((e) => { this.$message.error(e.message); this.loading = false; // 判断上传失败清除列表(文件名超过40字符) let uid = file.file.uid; const mainFile = this.$refs.uploadFile; if (mainFile && mainFile.length) { for (var i = 0; i < mainFile.length; i++) { if (uid == mainFile[i].uploadFiles[0].uid) { mainFile[i].clearFiles(); break; } } } }); }, handleRemove() {}, handlePreview() {}, handleExceed() { // 当前限制选择 1 个文件 this.$message.warning(this.$t('info.limitFile')); }, beforeRemove(file) { return this.$confirm(this.$t('info.detach') + `${file.name}?`); }, //点击下拉获取下拉选中ID onSelectedDrug(id) { this.getqueryChangeItemByModeId(id); }, click(index, item) { this.uploadId = item.itemId; }, onChange() {},
click(index, item) { this.uploadId = item.itemId; },