Как в атрибуте класса :class (vue js) использовать условие и статичный класс?

Question

[Grione]

Мне требуется в атрибуте класса :class использовать конструкцию
{'first-class': data.slideType == 'brand'}
и
`header_comp__headline--${hlStyle||hlDefault.style}`

Как это можно объединить?

Answer 1

[Александр]

:class="{ [`header_comp__headline--${hlStyle||hlDefault.style}`]: true, 'first-class': data.slideType == 'brand' }"

или

:class="[`header_comp__headline--${hlStyle||hlDefault.style}`, data.slideType == 'brand' ? 'first-class' : '']"

или

:class="[`header_comp__headline--${hlStyle||hlDefault.style}`, { 'first-class': data.slideType == 'brand' }]"

или вынести в computed.