Arbeid med attributter i rammeverket Vue
Å sette inn verdier fra data
kan gjøres ikke bare i tekst, men også i taggens attributter.
Dette gjøres ved hjelp av direktivet v-bind.
La oss ved hjelp av dette direktivet sette
verdien til attributtet src for taggen
img. La den ønskede verdien
lagres i egenskapen:
data() {
return {
attr: 'img.png',
}
}
La oss skrive verdien fra egenskapen til
attributtet src:
<template>
<img v-bind:src="attr">
</template>
Vanligvis bruker alle den forkortede
varianten av v-bind. Den representerer
seg selv som bare et kolon foran
attributtnavnet:
<template>
<img :src="attr">
</template>
La det i data lagres en tekst
og en lenkeadresse:
data() {
return {
text: 'page',
href: 'page.html',
}
}
Dan følgende kode ved hjelp av disse dataene:
<a href="page.html">page</a>