Објект со CSS класи во Vue

CSS класи може исто така да се чуваат во објекти. Притоа имињата на класите ќе бидат клучеви на објектот, а елементите на објектот ќе бидат логички вредности. Ако вредноста ќе биде true, тогаш класата ќе биде додадена на елементот, а ако false, тогаш нема да биде.

Ајде да испробаме во пракса. Нека имаме следниот објект со класи:

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

Да го поврземе овој објект со таг:

<template>
	<p :class="obj">text</p>
</template>

Даден е следниот објект со CSS класи:

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

Применете ги овие класи на некој таг. Проверете, кои класи се применети, а кои не.