A-Upload in vue + ant-design-vue lädt Dateien hoch. Das Front-End-Anti-Design-vue vue.js verwendet a-Upload zum Hochladen von Dateien. Sie müssen die Datei beurteilen, aber die Methode beforeupload

a-upload Datei in vue+ant-design-vue hochladen
Frontend
anti-design-vue
vue.js
Wenn Sie a-upload zum Hochladen von Dateien verwenden, müssen Sie die Datei beurteilen.
Die Methode beforeupload ist jedoch noch nicht abgeschlossen Die Aktions-Upload-Methode wird synchronisiert. Hochgeladen. Gleichzeitig läuft auch die @change-Methode

Wenn Sie A-Upload zum Hochladen von Dateien in Vue und Ant Design Vue verwenden, können Sie die Methode vor dem Hochladen verwenden, um die Datei zu beurteilen und zu verarbeiten. Da Before-Upload jedoch asynchron und die Upload-Methode synchron ist, kann es vorkommen, dass die Upload-Methode bereits mit der Ausführung begonnen hat, bevor die Before-Upload-Methode abgeschlossen ist. Um dieses Problem zu lösen, können Sie Promise verwenden, um sicherzustellen, dass die Methode vor dem Hochladen vor dem Hochladen ausgeführt wird.

Erstens können Sie in der Ereignisbehandlungsmethode der Upload-Schaltfläche Promise verwenden, um die Methode vor dem Hochladen zu umschließen, um sicherzustellen, dass ihre Ausführung abgeschlossen ist:

handleUpload() { return new Promise((resolve, ablehn) => { // Rufen Sie die Before-Upload-Methode auf, um die Datei zu beurteilen und zu verarbeiten this.beforeUpload() .then(( ) => { // Die Methode vor dem Hochladen ist abgeschlossen und die Upload-Methode kann ausgeführt werden. this.uploadFile(); auflösen(); // Versprechen auflösen }) .catch((error) => { Reject(error); // Versprechen ablehnen }); }); }, Dann können Sie in der Methode vor dem Hochladen die Methode Vue.nextTick verwenden, um sicherzustellen, dass die Methode @change vor der Beurteilung und Verarbeitung ausgeführt wird:













beforeUpload() { // Ein Versprechen zurückgeben, die @change-Methode im Versprechen ausführen, bevor es beurteilt und verarbeitet wird. return new Promise((resolve,ject) => { // Verwenden Sie Vue.nextTick, um sicherzustellen, dass die @change-Methode ausgeführt wird this.$nextTick(() => { // Dateien werden hier beurteilt und verarbeitet // … restart(); // Promise auflösen Auf diese Weise unabhängig vom Vor-Upload Methode Entweder die @change-Methode oder die @change-Methode wird ausgeführt, um sicherzustellen, dass vor dem Hochladen der Datei die erforderliche Dateibeurteilung und -verarbeitung durchgeführt wird. }, }); });










おすすめ

転載: blog.csdn.net/zezeaichirou/article/details/134316761