CSS-klasside objekt Vue'is
CSS-klassid võivad samuti olla salvestatud
objektidesse. Sel juhul on klasside nimed
objekti võtmeteks ja objekti elemendid
on loogilised väärtused.
Kui väärtus on true,
siis klass lisatakse elemendile,
ja kui false, siis mitte.
Proovime seda praktikas. Oletame, et meil on järgmine objekt klassidega:
data() {
return {
obj: {
active: true,
valid: false,
},
}
}
Seome selle objekti silti:
<template>
<p :class="obj">text</p>
</template>
Antud on järgmine objekt CSS-klassidega:
data() {
return {
obj: {
done: true,
selected: false,
},
}
}
Rakendage need klassid mõnele sildile. Kontrollige, millised klassid rakendusid, ja millised mitte.