Објекат са CSS класама у Vue

CSS класе такође могу бити сачуване у објектима. При томе имена класа ће бити кључеви објекта, а елементи објекта ће бити логичке вредности. Ако вредност буде true, онда ће класа бити додата елементу, а ако false, онда неће.

Хајде да испробамо у пракси. Нека имамо следећи објекат са класама:

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

Вежимо овај објекат за елемент:

App.vue<template>
  <p :class="obj">text</p>
</template>

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