Vue에서 CSS 클래스 객체 인라인 사용하기

CSS 클래스 객체는 class 속성의 값으로 직접 작성할 수 있습니다:

App.vue<template>
  <p :class="{active: true, error: false}">
    text
  </p>
</template>

하이픈을 포함하는 클래스 이름은 따옴표로 묶어야 합니다:

App.vue<template>
  <p :class="{active: true, 'has-error': false}">
    text
  </p>
</template>

javascript{active: true, valid: false}