Vollständiger Code von Vue + iView zur Realisierung der Excel-Upload-Funktion

<Col span="2">Datei hochladen:</Col>
<Col span="22" class="uploadExcelBox">
    <Hochladen ref="uploadExcel" :loading="uploadLoading" :action="uploadFileUrl" accept="xlsx,xls" :format="uploadFormat" :before-upload="vorBilddatei" :on-success="erfolgreicheBilddatei" :on-error="fehlerhafteBilddatei" :show-upload-list="true">
         <Button type="success">Anhang hochladen</Button>
	 </Hochladen>
     <div v-if="uploadingFile !== null">Hochzuladende Datei:
          <span class="blueFont">{{ Dateiname }}</span>
          <Button @click="uploadFun(index)" :loading="loadingStatus" class="manualUploadBtn">{{ loadingStatus ? 'Hochladen...' : 'Klicken, um mit dem Hochladen zu beginnen' }}</Button>
      </div>
</Col>

<Skript>
    // Excel aus „@/libs/excel“ importieren
	Importdienst von „@/libs/request“ // Wird verwendet, um den aktuellen Domänennamen abzurufen. Importieren Sie reportFormApi von „@/api/reportForm“.
    Standard exportieren {
        Daten() {
            zurückkehren {
                uploadLoading:false, //Upload-Steuerung Ladestatus uploadFileUrl: "",
				Upload-Format: ['xlsx', 'xls'],
				uploadingFile:null, //Hochzuladende Datei loadingStatus:false, //Status der Upload-Komponente fileName:"", //Name der hochzuladenden Datei}
        },
        montiert() {
            this.uploadFileUrl = service.apiUrl + "/qingximaster/winInfo/execlAdd"; //Schnittstellenpfad zum Hochladen von Excel, bereitgestellt vom Backend-Personal.
        },
        Methoden: {
			// Vor dem Hochladen des Bildes beforeImgFile(file) {
				// console.log(Datei);
				const fileExt = file.name.split('.').pop().toLocaleLowerCase()
				wenn (fileExt === 'xlsx' || fileExt === 'xls') {
					var formdata = neue FormData();
					formdata.append("Datei",Datei);
                    this.fileName = formdata.get('file').name; //Mit der Methode formdata.get('file') können Sie die Informationen in der Datei abrufen, beispielsweise den Excel-Dateinamen.
					this.uploadingFile = formdata; //Hinweis: Dies wird als Parameter an die hochzuladende Schnittstelle übergeben. Die an die Schnittstelle übergebene Datei benötigt nicht formdata.get('file'). Übergeben Sie die Datei einfach direkt.
				} anders {
					dies.$Notice.warning({
						Titel: 'Dateitypfehler',
						desc: 'Datei:' + Dateiname + 'Keine EXCEL-Datei, bitte wählen Sie eine EXCEL-Datei mit der Endung .xlsx oder .xls. '
					})
				}
				return false
			},
			// Hochladen erfolgreich successImgFile(response, file, fileList) {
                dies.$Notice.success({
                    Titel: 'Tipps',
                    desc: ,,Upload erfolgreich! '
                })
			},
			// Hochladen fehlgeschlagen errorImgFile(error, file, fileList) {
				dies.$Notice.success({
                    Titel: 'Tipps',
                    desc: ,,Upload fehlgeschlagen! '
                })
				konsole.log(Fehler);
			},
			uploadFun(index){//Schnittstelle zum Hochladen von Excel aufrufen
				dies.loadingStatus = wahr;
				reportFormApi.uploadExcel({
                    URL: diese.uploadFileUrl,
                    Datei: this.uploadingFile
                }).dann(res =>{
					diese.uploadingFile = null;
                    dieser.Dateiname = "";
                    wenn(res.code==0){
                        diese.infoList[index].inhalt = JSON.stringify(res.data);
					    // Konsole.log(diese.infoList[index].inhalt);
                        this.$Message.success("Upload erfolgreich!");
                    }anders{
                        dies.$Message.error(res.message);
                    }
				}).schließlich(()=>{
					this.loadingStatus = falsch;
                    this.uploadLoading = falsch;
                })
			},
        }
    }