Clases CSS a través de data en Vue
Las clases CSS se pueden añadir a un elemento
en función de los valores de las propiedades
del objeto data. Veamos un
ejemplo. Supongamos que tenemos las siguientes
propiedades:
data() {
return {
isActive: true,
hasError: true,
}
}
Añadamos clases CSS al elemento dependiendo del valor de nuestras propiedades:
<template>
<p :class="{active: isActive, error: hasError}">
texto
</p>
</template>
Se dan las siguientes propiedades:
data() {
return {
isValid: true,
isDisabled: true,
}
}
Haga que dependiendo de los valores de estas propiedades, se añadan las clases CSS correspondientes a la etiqueta.
