Classes CSS via data em Vue
As classes CSS podem ser adicionadas a um elemento
dependendo dos valores das propriedades
do objeto data. Vamos ver com
um exemplo. Suponha que temos as seguintes
propriedades:
data() {
return {
isActive: true,
hasError: true,
}
}
Vamos adicionar classes CSS ao elemento dependendo do valor das nossas propriedades:
<template>
<p :class="{active: isActive, error: hasError}">
texto
</p>
</template>
São dadas as seguintes propriedades:
data() {
return {
isValid: true,
isDisabled: true,
}
}
Faça com que, dependendo dos valores dessas propriedades, as classes CSS correspondentes sejam adicionadas à tag.
