Praca z atrybutami we frameworku Vue
Wstawiać wartości właściwości z data
można nie tylko w tekst, ale także w atrybuty tagów.
Robimy to za pomocą dyrektywy v-bind.
Za pomocą tej dyrektywy ustawmy
wartość atrybutu src dla tagu
img. Niech pożądana wartość
przechowuje się we właściwości:
data() {
return {
attr: 'img.png',
}
}
Zapiszmy wartość z właściwości w
atrybucie src:
<template>
<img v-bind:src="attr">
</template>
Zwykle wszyscy używają skróconej
wersji v-bind. Reprezentuje
ona po prostu dwukropek przed
nazwą atrybutu:
<template>
<img :src="attr">
</template>
Niech w data przechowuje się tekst
i adres linku:
data() {
return {
text: 'page',
href: 'page.html',
}
}
Sformułuj za pomocą tych danych następujący kod:
<a href="page.html">page</a>
