반응형 vuetify2 Vuetify 커스터마이징 - 체크박스 Component Framework 중 Vuetify 커스터마이징을 소개하려 합니다. Vuetify Document 를 보면 Slot, Props가 잘 소개되어 있는데요. 커스터마이징을 어떻게 해서 공용 컴포넌트로 활용할 수 있는지 소개합니다 :-) 제가 소개하는 커스터마이징 체크박스는 다음과 같은 기능이 있습니다. 체크 데이터 model 적용 이미지를 이용한 체크 유무 표기 및 사이즈 지정 라벨 표기 유무 및 색상, 사이즈 지정 체크박스 가로 위치 지정 데모로 보여드릴 샘플은 다음과 같이 표기됩니다. 코드는 두 개의 파일을 작성하였습니다. 데모 페이지를 표기하는 VuetifyCheckBoxView.vue 커스터마이징한 CCheckBox.vue Vuetify 에 v-checkbox 가 있기는 하지만 이 .. 2021. 7. 30. Vuetify 커스터마이징 - 버튼 (v-btn) Component Framework 중 Vuetify 커스터마이징을 소개하려 합니다. Vuetify Document 를 보면 Slot, Props가 잘 소개되어 있는데요. 커스터마이징을 어떻게 해서 공용 컴포넌트로 활용할 수 있는지 소개합니다 :-) 제가 소개하는 커스터마이징 버튼은 다음과 같은 기능이 있습니다. 버튼 내 문자열과 색상, 사이즈, Weight 등 지정 아이콘 앞, 뒤 선택하여 삽입 및 색상, 사이즈 등 지정 버튼의 Background, Border 색상 지정 버튼의 가로, 세로 크기 지정 클릭 이벤트 지정 Disabled 지정 데모로 보여드릴 샘플은 다음과 같이 표기됩니다. 코드는 두 개의 파일을 작성하였습니다. 데모 페이지를 표기하는 VuetifyDemoView.vue Vuetify 버.. 2021. 7. 30. 이전 1 다음 반응형
