Best Practices für das Warten auf das Ergebnis einer Funktion in Meteor?

Question

Ich habe diese Funktion, die ein Bild zu Cloudinary hochladen und dann den Status der Komponente als resultierende URL festlegen. Hier ist, wie es aussieht:

loadFileFront: function(e) { 
 
     var imageFrontURL = window.webkitURL.createObjectURL(e.target.files[0]); 
 
     var imageFrontFile = e.target.files[0]; 
 
     var returnedURL = ''; 
 
     Cloudinary._upload_file(imageFrontFile, {}, function(err, res) { 
 
      if (err){ 
 
       console.log(err); 
 
       return; 
 
      } 
 
      console.log(res.url); 
 
     }); 
 
     this.setState({ 
 
      imageFront: returnedURL, 
 
      imageFrontFile: imageFrontFile 
 
     }) 
 
    },

(ignorieren, die oberste Zeile mit createObjectURL). Ich habe eine Reihe von Untersuchungen gemacht, wie man das am besten strukturiert, so dass setState auf den Upload wartet, um die res.url zu vervollständigen, die zurückgegeben wird, und den Zustand damit richtig aktualisiert. Wenn ich res.url console.log, erscheint es nach ein paar Sekunden. Wenn ich versuche, returnedURL auf res.url zu setzen, gibt es keine Wartezeiten und es springt einfach durch den Rest der Funktion. Was ist der beste Weg, auf das Ergebnis des Cloudinary-Uploads hier zu warten? Ich habe über die Unterstützung von Async/Abwarten in Meteor 1.3 gelesen, aber ich hatte Probleme herauszufinden, wie man diese Cloudinary-Upload-Methode in einer Meteor-Methode auf dem Server konfiguriert. Jede Hilfe wird geschätzt!

Answer 1

Wenn ich das Problem richtig verstanden habe, dann sollte dies beheben. Sie möchten eine Fettpfeilfunktion für den Rückruf ausführen, damit Sie (this) korrekt übergeben können, und keine Probleme bei dem Aufrufen von this.setState auftreten. Auch da der Schlüssel und der Wert von imageFrontFile identisch sind, können Sie es verwenden, wie ich es unten eingegeben habe. Ich hoffe, das hilft.

loadFileFront: function(e) { 
    var imageFrontURL = window.webkitURL.createObjectURL(e.target.files[0]); 
    var imageFrontFile = e.target.files[0]; 
    var returnedURL = ''; 
    Cloudinary._upload_file(imageFrontFile, {}, (err, res) => { 
     if (err){ 
      console.log(err); 
      return; 
     } 
     this.setState({ 
      imageFront: res.url, 
      imageFrontFile 
     }); 
    }); 
}, 

Answer 2

Ich denke, Sie können den Job mit Zukunft tun. (https://www.npmjs.com/package/future)

Hier ist ein Beispiel: https://www.discovermeteor.com/patterns/5828399