Aus dem Kurs: Vue.js lernen

So erhalten Sie Zugriff auf diesen Kurs

Werden Sie noch heute Mitglied und erhalten Sie Zugriff auf mehr als 23.200 Kurse von Branchenfachleuten.

Attribut-Binding

Attribut-Binding

Wir haben bereits gesehen, wie man den Inhalt von HTML-Elementen dynamisch setzen kann, indem man diese Syntax mit den doppelten geschweiften Klammern verwendet. Wie kann man nun aber den Wert von Attributen dynamisch setzen? Das braucht man bspw., wenn man ein Bild ausgeben lassen möchte. Ich habe dafür unser Beispiel einmal etwas vereinfacht, oben etwas Code rausgelöscht, den wir nicht brauchen. Unten gibt es wie gehabt unser Objekt und da habe ich nun ergänzt eine Eigenschaft image und die ist auf diesen Bildpfad gesetzt und dieses Bild möchte ich anzeigen lassen. Schauen wir uns mal an, wie das funktioniert. Erst mal brauche ich das img-Element in HTML, dann brauche ich das src-Attribut und ich sollte auf jeden Fall noch einen Alternativtext angeben. Wie bekomme ich das hier aber nun hier oben rein? Die erste Möglichkeit, die man versuchen kann, ist, dass man dieselbe Syntax nimmt wie bisher, also dass ich mal schreibe person.image, aber das funktioniert nicht. Und wenn wir uns…

Inhalt