Switch 开关

选中值的开关

基础用法

<template>
	<LiSwitch v-model="val"></LiSwitch>
	<LiSwitch v-model="val" type="primary"></LiSwitch>
	<LiSwitch v-model="val" type="success"></LiSwitch>
	<LiSwitch v-model="val" type="danger"></LiSwitch>
	<LiSwitch v-model="val" type="warning"></LiSwitch>
	<LiSwitch v-model="val" type="info"></LiSwitch>
</template>
<script setup lang="ts">
	import { ref } from "vue";

	const val = ref(false);
</script>

禁用状态

使用disabled控制禁用状态

<template>
	<LiSwitch disabled v-model="val"></LiSwitch>
	<LiSwitch disabled v-model="val" type="primary"></LiSwitch>
	<LiSwitch disabled v-model="val" type="success"></LiSwitch>
	<LiSwitch disabled v-model="val" type="danger"></LiSwitch>
	<LiSwitch disabled v-model="val" type="warning"></LiSwitch>
	<LiSwitch disabled v-model="val" type="info"></LiSwitch>
</template>
<script setup lang="ts">
	import { ref } from "vue";

	const val = ref(false);
</script>

自定义值

使用enable-val、disable-val控制禁用状态

关

关

关

关

关

关

<template>
	<LiSwitch v-model="val" enable-val="开" disable-val="关"></LiSwitch>
	<LiSwitch
		v-model="val"
		enable-val="开"
		disable-val="关"
		type="primary"
	></LiSwitch>
	<LiSwitch
		v-model="val"
		enable-val="开"
		disable-val="关"
		type="success"
	></LiSwitch>
	<LiSwitch
		v-model="val"
		enable-val="开"
		disable-val="关"
		type="danger"
	></LiSwitch>
	<LiSwitch
		v-model="val"
		enable-val="开"
		disable-val="关"
		type="warning"
	></LiSwitch>
	<LiSwitch
		v-model="val"
		enable-val="开"
		disable-val="关"
		type="info"
	></LiSwitch>
</template>
<script setup lang="ts">
	import { ref } from "vue";

	const val = ref(false);
</script>

插槽

使用checked获取当前值

false

<template>
	<LiSwitch v-model="val">
		<template #default="{ checked }">
			{{ checked }}
		</template>
	</LiSwitch>
</template>
<script setup lang="ts">
	import { ref } from "vue";

	const val = ref(false);
</script>

Input Attributes

参数	说明	类型	可选值	默认值
disabled	禁用	boolean		false
disable-val	关值	string
enable-val	开值	string
type	类型	string	default / primary / success / warning / info / danger	default

Input Slots

插槽名	说明
-	默认， checked 为当前值