Attributes i Vue skrives grundlæggende ligesom i HTML name=”value”. Men vil man gøre attributes dynamiske kan man ikke bruge {{ }} som andre steder i Vue. Her bruges i stedet et directive, der hedder v-bind. Hvis jeg i min data har f.eks. adressen til et billede som her
// app.js
data() {
return {
imageSource: 'https://picsum.photos/800/600'
}
},
Kan jeg indsætte data i en attribute med v-bind directive som her
<!--html-->
<div id="app">
<img v-bind:src="imageSource" alt="">
</div>
v-bind kan dog undlades, så man kun sætter et kolon foran en attribute, f.eks. :src
- Introduktion til VueJS
- Vue – Events
- Vue – Methods
- Vue – Directives
- Vue – Attribute binding
- Vue – Computed properties
- Vue – refs
Læs mere om Vue