Skip to content

Switch 스위치 ​

미니프로그램 측은 view 자체 그리기

네이티브 switch 컴포넌트는 미니프로그램에서 스타일을 제어할 수 없어, view로 슬라이더를 직접 그려 시각적 일치를 보장합니다.

기본 사용법 ​

vue
<template>
  <lh-switch v-model="on" />
  <lh-switch v-model="on" active-text="켜짐" inactive-text="꺼짐" />
  <lh-switch v-model="on" loading />
  <lh-switch v-model="on" disabled />
</template>

<script setup lang="ts">
import { ref } from 'vue'
const on = ref(true)
</script>

Props ​

속성설명타입기본값
modelValue (v-model)켜짐 여부booleanfalse
disabled비활성화booleanfalse
loading로딩 중booleanfalse
name네이티브 namestring—
size크기'small' | 'medium' | 'large'—
activeText켜짐 문구string—
inactiveText꺼짐 문구string—
customClass커스텀 클래스명string—
sx빠른 레이아웃 속성LhSxProps—

Events ​

이벤트설명콜백 매개변수
update:modelValue값 변경(value: boolean)
change값 변경(value: boolean)