Versuchen Sie, die Funktion asynchron zu machen, um die Aktion erst nach dem Hochladen der Daten auszuführen

Question

Bearbeitet, um unten eine Frage hinzuzufügen: Derzeit läuft es einwandfrei, es läuft nur nicht asynchron (ich denke, das ist der Grund, warum das asynchrone Warten versucht).

Meine Frage ist, wie ich den Übermittlungsprozess asynchron gestalten kann, sodass ich erst nach dem Hochladen der Informationen eine Aktion ausführen kann (in diesem Fall den Benutzer nach den bevorzugten nächsten Schritten fragen).

const handleSubmit = async () => {
  
  try {
    if (image.value) {
      await uploadImage(image.value); <--I thought this was 
        asynchronous, but I tested and I don't think it is. 
    }

    const colRef = collection(db, "collection");

    //I thought the below was asynchronous, but it's not
    await addDoc(colRef, 
       {
      data: data.value <--placeholder
     
    });
    
      });
  } catch {

  }

  //code to run after addDoc is done, but it runs immediately
  $q.dialog({
      [content]
    })
};

Update: Ich habe die addDoc-Funktion durch die .then-Funktion ersetzt und das scheint zu funktionieren. Das aktuelle Problem besteht darin, dass ich die Funktion „uploadImage“ nicht abschließen kann, bevor ich die Funktion „addDoc“ ausgeführt habe.

Dies ist mein Versuch, die Funktion „uploadImage“ festzuschreiben, von der ich weiß, dass sie schlampig und falsch ist:

if (image.value) {
          return new Promise((resolve, reject) => {
            const newImage = uploadImage(image.value);
            resolve(newImage);
          });
        } else {
          console.log("error");
        }

Answer 1

只有当您的 uploadImage() 和 addDoc() 函数返回 JavaScript 承诺。

请参阅来自nodejs.dev的这篇文章有关 async/await 的更多信息。