본문 바로가기 메뉴 바로가기

beomy

프로필사진
  • 글쓰기
  • 관리
  • 태그
  • 방명록
  • RSS

beomy

검색하기 폼
  • 분류 전체보기 (93)
    • JavaScript (22)
    • React.JS (15)
    • Vue.JS (50)
    • ETC... (6)
  • 방명록

:class (1)
[Vue.JS] 클래스와 스타일 바인딩

이번 포스트에서는 컴포넌트에 클래스를 바인딩하는 방법과 인라인 스타일을 사용하는 방법을 이야기 하려고 합니다. 스타일을 적용할 때 클래스와 인라인 스타일이 많이 사용되기 때문에, 이번 포스트는 컴포넌트에 스타일을 적용하는 방법을 이야기 한다고 보셔도 될 것 같습니다. 1. HTML 클래스 바인딩 객체로 클래스를 바인딩 하는 방법, 배열로 클래스를 사용하는 방법, 컴포넌트와 함께 사용하는 방법 3가지를 이야기 하도록 하겠습니다. 객체 구문 클래스를 동적으로 바인딩하기 위해서는 v-bind:class(약어 :class)를 사용하면 됩니다. :class에 객체를 전달해서 클래스를 바인딩 할 수 있습니다. 위 예제에서 isActive가 true일 경우 active 클래스가 바인딩 됩니다. 객체를 이용하여 여러 ..

Vue.JS 2018. 11. 13. 23:41
이전 1 다음
이전 다음
공지사항
최근에 올라온 글

Blog is powered by Tistory / Designed by Tistory

티스토리툴바