feat: 新增 switch 组件 onswitch-color 与 unswitch-color 属性

This commit is contained in:
就眠儀式
2022-03-26 05:20:12 +08:00
parent ba7be89388
commit 5fc3cf9731
4 changed files with 15 additions and 3 deletions

View File

@@ -13,6 +13,8 @@ export interface LaySwitchProps {
modelValue?: boolean;
onswitchText?: string;
unswitchText?: string;
onswitchColor?: string;
unswitchColor?: string;
}
const props = withDefaults(defineProps<LaySwitchProps>(), {
@@ -36,12 +38,19 @@ const handleClick = function () {
isActive.value = !isActive.value;
}
};
const styles = computed(() => {
return { 'background-color': isActive.value ? props.onswitchColor : props.unswitchColor}
})
</script>
<template>
<span @click.stop="handleClick">
<div
class="layui-unselect layui-form-switch"
:style="styles"
:class="{
'layui-disabled': disabled,
'layui-form-onswitch': isActive,