CSS triedy pomocou data vo Vue
CSS triedy je možné pridávať elementu
v závislosti od hodnôt vlastností
objektu data. Pozrime sa na
príklade. Nech máme nasledujúce
vlastnosti:
data() {
return {
isActive: true,
hasError: true,
}
}
Pridajme elementu CSS triedy v závislosti od hodnoty našich vlastností:
<template>
<p :class="{active: isActive, error: hasError}">
text
</p>
</template>
Sú dané nasledujúce vlastnosti:
data() {
return {
isValid: true,
isDisabled: true,
}
}
Zaistite, aby v závislosti od hodnôt týchto vlastností sa do tagu pridali príslušné CSS triedy.
