Vue verwendet die Element-el-upload-Komponente, um auf die Grube zu treten

 <el-hochladen
            Aktion="https://xxxx Adresse"
            :header="Header importieren"
          >
   </el-upload>
 
importiere {getToken} von '@/utils/token'
 
 
Daten() {
    zurückkehren {
      importHeaders: {token: getToken()},
    };
  },

 <el-hochladen
            Aktion="https://security.brofirst.cn/api/common/upload"
            :header="Header importieren"
            :Grenze="Grenze"
             :on-exceed="MasterdateiMax"
          >
            <i class="el-icon-plus"></i>
          </el-upload>
 
 
 
  // Wie viele Bilder können maximal hochgeladen werden masterFileMax(files, fileList) {
        console.log(Dateien, Dateiliste);
        this.$message.warning(`Bitte laden Sie höchstens ${this.limit} Dateien hoch.`);
    },

  <el-hochladen
             akzeptieren=".JPG, .PNG, .JPEG,.jpg, .png, .jpeg"
             mehrere
          >
            <i class="el-icon-plus"></i>
          </el-upload>

   <el-hochladen
            Aktion="https://xxxx"
            :header="Header importieren"
            Listentyp = "Bildkarte"
            :on-preview="handleBildkartenvorschau"
            :on-remove="handleEntfernen"
            :bei-Erfolg="handleAvatarSuccess"
            :Grenze="Grenze"
             :on-exceed="MasterdateiMax"
             akzeptieren=".JPG, .PNG, .JPEG,.jpg, .png, .jpeg"
             mehrere
          >
            <i class="el-icon-plus"></i>
          </el-upload>
 
 
 
<Skript>
importiere {getToken} von '@/utils/token'
Standard exportieren {
  Name: „Feedback“,
  Daten() {
    zurückkehren {
      importHeaders: {token: getToken()},
       Bilder:[],
      Grenze:9
    };
  },
  Methoden: {
  //Bild löschen handleRemove(file, fileList) {
     const idx = this.images.findIndex(it=>it===file.response.data.fullurl)
     dies.images.splice(idx,1)
    },
    handlePictureCardPreview(Datei) {
      this.dialogImageUrl = Datei.URL;
      this.dialogVisible = true;
    },
    //Daten nach erfolgreichem Upload handleAvatarSuccess(response, file, fileList){
      console.log(Antwort, Datei, Dateiliste);
      wenn(Antwort.code===1){
        dies.bilder.push(antwort.daten.volleURL)
      }
    },
    // Wie viele Bilder können maximal hochgeladen werden masterFileMax(files, fileList) {
        console.log(Dateien, Dateiliste);
        this.$message.warning(`Bitte laden Sie höchstens ${this.limit} Dateien hoch.`);
    }
  }
};
</Skript> 

<el-hochladen
               v-sonst
               Klasse = "sicherstellen, dass Butt"
               :Aktion="Datei-Url importieren"
               :data="Daten hochladen"
               Name="Importdatei"
               :beiFehler="UploadFehler"
               :onSuccess="Uploaderfolgreich"
               :beforeUpload="vorAvatarUpload"
               >
               <el-button size="small" type="primary">OK</el-button>

Daten () {
    importFileUrl: 'http:dtc.com/cpy/add',
    Daten hochladen: {
        cpyId: '123456', 
        auftretenZeit: '2017-08'
    }
},
Methoden: {
    // Rückruf nach erfolgreichem UploaduploadSuccess (response, file, fileList) {
      console.log('Datei hochladen', Antwort)
    },
    // Upload-Fehler uploadError (Antwort, Datei, Dateiliste) {
      console.log('Upload fehlgeschlagen, bitte versuchen Sie es erneut!')
    },
    //Bestimmen Sie die Dateigröße vor dem Hochladen beforeAvatarUpload (file) {
      const Erweiterung = Datei.Name.Split('.')[1] === 'xls'
      const extension2 = datei.name.split('.')[1] === 'xlsx'
      const extension3 = datei.name.split('.')[1] === 'doc'
      const extension4 = datei.name.split('.')[1] === 'docx'
      const isLt2M = Dateigröße / 1024 / 1024 < 10
      wenn (!Erweiterung && !Erweiterung2 && !Erweiterung3 && !Erweiterung4) {
        console.log('Die hochgeladene Vorlage kann nur im xls-, xlsx-, doc- oder docx-Format vorliegen!')
      }
      wenn (!isLt2M) {
        console.log('Die Größe der hochgeladenen Vorlage darf 10 MB nicht überschreiten!')
      }
      Erweiterung zurückgeben || Erweiterung2 || Erweiterung3 || Erweiterung4 && isLt2M
    }
}