[Udemy Vue 완벽가이드 Section2] 36. 동적 클래스 : 배열구문

여러 개의 동적 클래스 속성을 가질 수 있게 Vue가 지원하는 기능들 중, 객체 구문 외에 한 가지 더 있다.

바로, '배열'!

 

어떤 클래스를 추가할지 구성하는 '객체'가 '배열'의 한 요소가 될 수 있다.

<div :class="['demo', { active: boxBSelected }]"></div>

위와 같이, 배열구문을 사용하면 동적으로 생길 수 있는 여러 class들을 같은 <div>에 추가할 수 있다.

** :style에도 배열([]) 사용 가능하다!

 

동적으로 클래스/스타일속성을 추가할 경우, 객체, 배열 등 여러 옵션이 있으므로 선호에 따라 작성하면 된다.

 

 

** 출처: 모든 내용은 Udemy Vue-완벽가이드 강의를 기반으로 작성하였습니다.