Zugriff auf die zurückgegebenen Daten von jQuery Last

ich auf einer vue.js Komponente bin arbeiten, und ich habe diese berechnete Eigenschaft bekam:Zugriff auf die zurückgegebenen Daten von jQuery Last

loading_asset_status(){ 
     var img = $("img.modal-main-image").attr('src', this.current_image.img_url) 
      .on('load', function() { 
       return (!this.complete || typeof this.naturalWidth == "undefined" || this.naturalWidth == 0); 
      }); 
     return img; 
    }

Die berechnete Eigenschaft muss wahr oder falsch zurück, die von auf Belastung zurückgeführt wird Funktion, aber die img-Variable enthält jQuery-DOM-Objekt anstelle von wahr oder falsch, wie ich wollte. Das funktioniert also nicht.

Ich habe auch versucht dies:

loading_asset_status(){ 
     var status; 
     var img = $("img.modal-main-image").attr('src', this.current_image.img_url) 
      .on('load', function() { 
       status = (!this.complete || typeof this.naturalWidth == "undefined" || this.naturalWidth == 0); 
      }); 
     return status; 
    }

Aber dieses gibt undefined zurück. Irgendwelche Ideen, wie man es löst?

Quelle

2017-01-26 El Danielo

Es gibt keinen Status zurück, da dies asynchron ist, haben Sie zurückgegeben, noch bevor der Code in .on noch ausgeführt wird.

Sie können jedoch eine Datenvariable wie folgt festgelegt:

loading_asset_status(){ 
     var img = $("img.modal-main-image").attr('src', this.current_image.img_url) 
      .on('load',() => { 
       this.status = (!this.complete || typeof this.naturalWidth == "undefined" || this.naturalWidth == 0); 
      }); 
    }

Wo Status müssen Sie in Datenteil der vue Instanz definieren.

Quelle

2017-01-26 09:36:08 Saurabh

Ich verstehe nicht wirklich, was ich tun soll. Vielleicht bin ich sehr falsch mit meinem Ansatz mit dieser Sache. Was ich erreichen möchte, ist facebook wie image modal, wo Benutzer Galerie durchsuchen, Fotos kommentieren etc. All dies ist einfach, aber ich konnte keine andere Möglichkeit finden, meine Komponente wissen zu lassen, ob das gewünschte Bild geladen wurde. Dann zeige ich einfach mein Ladesymbol. Gibt es einen besseren Ansatz in Vue anstelle von jQuery? –

@ElDanielo, Wie @Saurabh sagte, '.on' function akzeptiert eine' Callback' Funktion 'on ('load', function() {'. Das Problem ist, dass 'return status;' vor der 'load' Methode ausgeführt wird und das ist der Grund, warum Sie "undefined" erhalten.Eine der Lösungen ist, eine "Callback" -Funktion wie in meiner Antwort zu verwenden, oder wie gesagt @Saurabh in seiner Antwort. –

@ElDanielo Mit meinem Ansatz können Sie einen Status [Daten ] (https://vuejs.org/v2/api/#Options-Data) Variable, die am Anfang auf false gesetzt und in Ihrer jquery auf true gesetzt werden kann.Sie können diese Variable in Ihrem 'v-if' für verwenden Lade-Symbol wird angezeigt. – Saurabh

Der Aufruf der Ladeereignisfunktion ist asynchron. Dafür ist der Rückgabewert (Status) undefiniert. Ein Weg, Ihnen Problem zu lösen, ist eine Callback-Funktion ist

loading_asset_status(Callback){ 
    var status; 
    var lCallback = Callback; 
    var img = $("img.modal-main-image").attr('src', this.current_image.img_url) 
     .on('load', function() { 
      status = (!this.complete || typeof this.naturalWidth == "undefined" || this.naturalWidth == 0); 
      lCallback (status) 
     }); 
    return status; 
}

Quelle

2017-01-26 09:38:35 Sngvk

Die Lösung hat eine callback Funktion zu verwenden.

loading_asset_status(function(status){ 
    return status; 
}); 
loading_asset_status(callback){ 
     var status; 
     var img = $("img.modal-main-image").attr('src', this.current_image.img_url) 
      .on('load', function(){ 
       status = (!this.complete || typeof this.naturalWidth == "undefined" || this.naturalWidth == 0); 
       callback(status); 
     }); 
}

Quelle

2017-01-26 09:44:49

Zugriff auf die zurückgegebenen Daten von jQuery Last

Antwort

Verwandte Themen