vue 클래스 바인딩 (1) 썸네일형 리스트형 Vuejs 2 . 클래스 바인딩 & 스타일 바인딩 1. 클래스 바인딩 아래는 버튼을 클릭하면 클래스를 바인딩하여 스타일을 부여하는 예제입니다. 먼저 에 v-bind:class="{ 클래스: 변수 }를 넣어주었습니다. 예제에서는 v-bind:를 : 로 줄여서 적었습니다. 그 다음 데이터에 해당 변수값 false를 주었습니다. 그러면 일단 버튼을 클릭하기 전까지는 에 클래스가 없는 상태가 될것입니다. 그리고 메소드에 update()함수를 만들어 변수가 true가 되도록 작성한뒤, 이 함수를 의 클릭이벤트값으로 넣어주었습니다. 주석표시한 부분처럼 작성해도 결과는 같습니다. 버튼을 클릭하기 전에는 의 클래스가 없다가 버튼을 클릭하면 변수가 true가 되었으니 클래스가 생기면서 폰트의 컬러는 레드로, 사이즈는 40px로 바뀌게 됩니다. **클래스명에 하이픈이 들.. 이전 1 다음