Classes CSS via data dans Vue
Les classes CSS peuvent être ajoutées à un élément
en fonction des valeurs des propriétés
de l'objet data. Regardons un
exemple. Supposons que nous ayons les propriétés
suivantes :
data() {
return {
isActive: true,
hasError: true,
}
}
Ajoutons des classes CSS à l'élément en fonction de la valeur de nos propriétés :
<template>
<p :class="{active: isActive, error: hasError}">
text
</p>
</template>
Les propriétés suivantes sont données :
data() {
return {
isValid: true,
isDisabled: true,
}
}
Faites en sorte qu'en fonction des valeurs de ces propriétés, les classes CSS correspondantes soient ajoutées à la balise.
