async erwarten in Bild Laden

Question

Temp.js

export default class Temp { 
    async addImageProcess(src){ 
     let img = new Image(); 
     img.src = src; 
     return img.onload = await function(){ 
      return this.height; 
     } 
    } 
} 

anotherfile.js

import Temp from '../../classes/Temp' 
let tmp = new Temp() 

imageUrl ="https://www.google.co.in/images/branding/googlelogo/2x/googlelogo_color_120x44dp.png" 
let image = tmp.addImageProcess(imageUrl); 
console.log(image) 

über meinen Code. Ich habe eine Bild-URL und versuchte, die Eigenschaften des Bildes mit Async zu erhalten, aber es funktioniert nicht, verstehe nicht, was ich verpasst habe.

Answer 1

Ihr Problem hier erstreckt sich von the definition for await ...

Der await Operator für eine Eigenschaft

Die Image.prototype.onloadPromise verwendet wird, warten ist kein Versprechen, noch werden Sie es eine Zuordnung. Wenn Sie wollen die height Eigenschaft nach dem Laden zurückzukehren, würde ich stattdessen erstellen Promise ...

addImageProcess(src){ 
    return new Promise((resolve, reject) => { 
    let img = new Image() 
    img.onload =() => resolve(img.height) 
    img.onerror = reject 
    img.src = src 
    }) 
} 

würden Sie dann die Verwendung folgender diesem Wert für den Zugriff auf

tmp.addImageProcess(imageUrl).then(height => { 
    console.log(height) 
}) 

oder, wenn innerhalb eine async Funktion

async function logImageHeight(imageUrl) { 
    console.log('height', await tmp.addImageProcess(imageUrl)) 
}