[vue] vue 클래스 바인딩(다이너믹 클래스, 객체, 배열, 토글, 스타일 바로 적용) vue.js에서 속성 바인딩으로 클래스를 적용하는 방법을 알아보겠습니다. 다이너믹 클래스(Dynamic class) 미리 클래스 이름에 스타일을 지정해 놓고, 조건에 맞추어 해당 클래스 적용시킬 때 사용합니다. 다이너믹 클래스를 적용하는 방법은 2가지입니다. 사용할 예제 {{ item.subject }} 화면 결과 v-for로 items에서 subject만 추출하였고, style 태그 안에, 클래스 done/important/ready의 이름과 스타일을 지정해 주었습니다. 다이너믹 클래스를 적용하는 방법은 객체와 배열의 방식이 있습니다. 하나씩 알아보겠습니다. 1. 객체(object) 객체 속성에는 클래스 이름, 값은 조건을 넣어 줍니다. v-bind:class="{ 클래스 이름: 조건 }" 예제 1) .. 이전 1 다음 반응형