Objekat sa CSS klasama u Vue
CSS klase se takođe mogu čuvati u
objektima. Pri tome, imena klasa
će biti ključevi objekta, a elementi
objekta će biti logičke vrednosti.
Ako je vrednost true,
klasa će biti dodata elementu,
a ako je false, neće.
Hajde da probamo u praksi. Neka imamo sledeći objekat sa klasama:
data() {
return {
obj: {
active: true,
valid: false,
},
}
}
Povežimo ovaj objekat sa tagom:
<template>
<p :class="obj">tekst</p>
</template>
Dat je sledeći objekat sa CSS klasama:
data() {
return {
obj: {
done: true,
selected: false,
},
}
}
Primenite ove klase na neki tag. Proverite koje klase su se primenile, a koje nisu.