Trabalhando com atributos no framework Vue
Inserir valores de propriedades do data
não é apenas possível no texto, mas também nos atributos das tags.
Isso é feito usando a diretiva v-bind.
Vamos usar esta diretiva para definir
o valor do atributo src para a tag
img. Deixe o valor desejado
armazenado na propriedade:
data() {
return {
attr: 'img.png',
}
}
Vamos escrever o valor da propriedade no
atributo src:
<template>
<img v-bind:src="attr">
</template>
Geralmente, todos usam a versão abreviada
de v-bind. Ela consiste simplesmente
em dois-pontos antes do nome do atributo:
<template>
<img :src="attr">
</template>
Suponha que o texto e o endereço do link
estejam armazenados no data:
data() {
return {
text: 'page',
href: 'page.html',
}
}
Crie o seguinte código usando esses dados:
<a href="page.html">page</a>
