grace's dev_note

  • 홈
  • 태그
  • 방명록

Class 1

[Vue3] 클래스와 스타일 바인딩

HTML 클래스 바인딩 객체 바인딩 클래스를 동적으로 바인딩 하기위해서는 :class(v-bind:class)를 사용할 수 있습니다. ({ active: isActive.value && !hasError.value, 'text-danger': !isActive.value && hasError.value, })); 배열에 바인딩 배열에 :class를 바인딩하여 클래스 목록을 적용할 수 있습니다. const activeClass = ref('active') const errorClass = ref('text-danger') 인라인 스타일 바인딩 HTML style 속성에 객체값을 바인딩할 수 있습니다. const activeColor = ref('red') const fontSize = ref(30) 템플릿..

FrontEnd/Vue 2023.04.17
이전
1
다음
더보기
프로필사진

기술 및 회고 블로그

  • 분류 전체보기
    • 회고
    • FrontEnd
      • Next.js
      • React
      • ReactNativ..
      • Vue
    • Javascript
      • 러닝 자바스크립트
      • 모던 자바스크립트
    • CS
    • DataScienc..
      • Data Struc..
      • LeetCode
    • BackEnd
      • Express
      • Node.js
      • Nest.js
    • DevOps
      • Docker
    • 코드캠프

Tag

Vue, vue-query, Vue.js, node.js, vitejs, 번들러, javascript, 알고리즘, nest.js, backend, 함수, tanstack, 자바스크립트, Vue3, React Native, Vite, postgres, pinia, Express, PostgreSQL,

최근글과 인기글

  • 최근글
  • 인기글

최근댓글

공지사항

페이스북 트위터 플러그인

  • Facebook
  • Twitter

Archives

Calendar

«   2025/07   »
일 월 화 수 목 금 토
1 2 3 4 5
6 7 8 9 10 11 12
13 14 15 16 17 18 19
20 21 22 23 24 25 26
27 28 29 30 31

방문자수Total

  • Today :
  • Yesterday :

Copyright © Kakao Corp. All rights reserved.

티스토리툴바