Trabajo con atributos en el framework Vue
Insertar valores de propiedades desde data
no solo es posible en el texto, sino también en los atributos de las etiquetas.
Esto se hace usando la directiva v-bind.
Usemos esta directiva para establecer
el valor del atributo src para la etiqueta
img. Dejemos que el valor deseado
se almacene en la propiedad:
data() {
return {
attr: 'img.png',
}
}
Escribamos el valor desde la propiedad en
el atributo src:
<template>
<img v-bind:src="attr">
</template>
Normalmente todos usan la forma abreviada
de v-bind. Esta consiste
simplemente en dos puntos antes del
nombre del atributo:
<template>
<img :src="attr">
</template>
Supongamos que en data se almacena el texto
y la dirección del enlace:
data() {
return {
text: 'page',
href: 'page.html',
}
}
Forme el siguiente código usando estos datos:
<a href="page.html">page</a>
