Објект со 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,
    },
  }
}