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

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