theluyuan/layui
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

✨(switch): 新增 loading 与 loading-icon 属性

Browse Source
This commit is contained in:
就眠儀式
2022-08-07 03:01:12 +08:00
parent 06f0985912
commit 97446b1fb0
2 changed files with 43 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
package/component/src/component/switch/index.vue
View File

@@ -19,12 +19,15 @@ export interface LaySwitchProps {
onswitchValue?: string | number | boolean;
unswitchValue?: string | number | boolean;
size?: "lg" | "md" | "sm" | "xs";
loadingIcon?: string;
loading?: boolean;
}
const props = withDefaults(defineProps<LaySwitchProps>(), {
disabled: false,
onswitchValue: true,
unswitchValue: false,
loadingIcon: "layui-icon-loading-one",
size: "md",
});
@@ -75,8 +78,13 @@ const styles = computed(() => {
<em>{{ isActive == true ? onswitchText : unswitchText }}</em>
<span>
<div>
<slot v-if="isActive" name="onswitch-icon"></slot>
<slot v-else name="unswitch-icon"></slot>
<template v-if="loading">
<i class="layui-icon layui-anim layui-anim-rotate layui-anim-loop" :class="loadingIcon"></i>
</template>
<template v-else>
<slot v-if="isActive" name="onswitch-icon"></slot>
<slot v-else name="unswitch-icon"></slot>
</template>
</div>
</span>
</div>