CSS-klasser via data i Vue
CSS-klasser kan läggas till ett element
beroende på värdena för egenskaperna
i data-objektet. Låt oss titta på
ett exempel. Antag att vi har följande
egenskaper:
data() {
return {
isActive: true,
hasError: true,
}
}
Låt oss lägga till CSS-klasser till elementet beroende på värdet av våra egenskaper:
<template>
<p :class="{active: isActive, error: hasError}">
text
</p>
</template>
Följande egenskaper är givna:
data() {
return {
isValid: true,
isDisabled: true,
}
}
Gör så att beroende på värdena för dessa egenskaper läggs motsvarande CSS-klasser till i taggen.
