Objekti me klasa CSS në Vue
Klasat CSS gjithashtu mund të ruhen në
objekte. Në këtë rast emrat e klasave
do të jenë çelësat e objektit, dhe elementët
e objektit do të jenë vlera logjike.
Nëse vlera është true,
atëherë klasa do të shtohet elementit,
dhe nëse është false, atëherë nuk do të shtohet.
Le ta provojmë në praktikë. Le të supozojmë se kemi objektin vijues me klasa:
data() {
return {
obj: {
active: true,
valid: false,
},
}
}
Le ta lidhim këtë objekt me një element:
<template>
<p :class="obj">text</p>
</template>
Jepet objekti vijues me klasa CSS:
data() {
return {
obj: {
done: true,
selected: false,
},
}
}
Aplikoni këto klasa në një element. Kontrolloni cilat klasa u aplikuan, dhe cilat jo.
