Vue-də CSS sinifləri obyekti
CSS sinifləri həmçinin
obyektlərdə saxlana bilər.
Bu zaman sinif adları
obyektin açarı, obyektin elementləri
isə məntiqi dəyərlər olacaq.
Əgər dəyər true olarsa,
sinif elementə əlavə ediləcək,
əgər false olarsa, əlavə edilməyəcək.
Gəlin praktikada sınayaq. Tutaq ki, bizim aşağıdakı siniflər obyekti var:
data() {
return {
obj: {
active: true,
valid: false,
},
}
}
Gəlin bu obyekti teqə bağlayaq:
<template>
<p :class="obj">mətn</p>
</template>
Aşağıdakı CSS sinifləri obyekti verilmişdir:
data() {
return {
obj: {
done: true,
selected: false,
},
}
}
Bu sinifləri hər hansı bir teqə tətbiq edin. Hansı siniflərin tətbiq edildiyini, hansının etmədiyini yoxlayın.