feat: transition 新增 enable 属性, 用于开启关闭过渡

This commit is contained in:
就眠儀式 2022-03-24 16:23:29 +08:00
parent ce356012ce
commit 7b6854629b
2 changed files with 11 additions and 6 deletions

View File

@ -53,8 +53,8 @@ const handleClick = function () {
<em>{{ isActive == true ? activeText : inactiveText }}</em>
<span>
<div>
<slot v-if="isActive" name="onswitch-icon"></slot>
<slot v-else name="unswitch-icon"></slot>
<slot v-if="isActive" name="onswitch-icon"></slot>
<slot v-else name="unswitch-icon"></slot>
</div>
</span>
</div>

View File

@ -1,8 +1,11 @@
<template>
<LayCollapseTransition v-if="type === 'collapse'"
><slot></slot
></LayCollapseTransition>
<LayFadeTransition v-if="type === 'fade'"><slot></slot></LayFadeTransition>
<template v-if="enable">
<LayCollapseTransition v-if="type === 'collapse'"><slot></slot></LayCollapseTransition>
<LayFadeTransition v-if="type === 'fade'"><slot></slot></LayFadeTransition>
</template>
<template v-else>
<slot></slot>
</template>
</template>
<script lang="ts">
@ -17,9 +20,11 @@ import LayFadeTransition from "./fadeTransition.vue";
export interface LayTransitionProps {
type?: string;
enable?: boolean;
}
const props = withDefaults(defineProps<LayTransitionProps>(), {
type: "collapse",
enable: true
});
</script>