# CSS классы через data в Vue

CSS классы можно добавлять элементу в зависимости от значений свойств объекта `data`. Посмотрим на примере. Пусть у нас есть следующие свойства:

`data() { return { isActive: true, hasError: true, } }`

Добавим элементу CSS классы в зависимости от значения наших свойств:

`<template> <p :class="{active: isActive, error: hasError}"> text </p> </template>`

Даны следующие свойства:

`data() { return { isValid: true, isDisabled: true, } }`

Сделайте так, чтобы в зависимости от значений этих свойств в тег добавлялись соответствующие CSS классы.

←→
↑