javascript / beginner
Snippet
Listen rendern mit v-for
Die v-for-Direktive wird verwendet, um eine Liste von Elementen basierend auf einem Array zu rendern. Sie benötigt ein spezielles :key-Attribut, damit Vue die DOM-Elemente effizient verfolgen und aktualisieren kann.
snippet.js
1
2
3
4
5
<ul><li v-for="user in users" :key="user.id">{{ user.name }}</li></ul>
vue
Erklärung
1
v-for="user in users"
Iteriert durch das 'users'-Array und weist jedes Element der lokalen Variable 'user' zu.
2
:key="user.id"
Liefert einen eindeutigen Identifikator für jedes Element, was für die Performance wichtig ist.
3
{{ user.name }}
Verwendet die 'Mustache'-Syntax, um die Namenseigenschaft des aktuellen Benutzers auszugeben.