Objek dengan Kelas CSS dalam Vue
Kelas CSS juga boleh disimpan dalam
objek. Dalam kes ini, nama kelas
akan menjadi kunci objek, dan elemen
objek akan menjadi nilai boolean.
Jika nilainya true,
maka kelas akan ditambahkan pada elemen,
dan jika false, maka tidak akan.
Mari kita cuba dalam praktik. Katakan kita mempunyai objek berikut dengan kelas:
data() {
return {
obj: {
active: true,
valid: false,
},
}
}
Ikat objek ini kepada tag:
<template>
<p :class="obj">text</p>
</template>
Diberi objek berikut dengan kelas CSS:
data() {
return {
obj: {
done: true,
selected: false,
},
}
}
Gunakan kelas-kelas ini pada mana-mana tag. Periksa kelas mana yang telah diterapkan, dan mana yang tidak.
