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:

javascriptdata() {
  return {
    obj: {
      active: true,
      valid:  false,
    },
  }
}

Gəlin bu obyekti teqə bağlayaq:

App.vue<template>
  <p :class="obj">mətn</p>
</template>

javascriptdata() {
  return {
    obj: {
      done: true,
      selected:  false,
    },
  }
}