<script setup lang="ts">
// 加载状态
const isLoad = ref(true)
// 切换动画
const transitionProps = reactive({
enterActiveClass: 'animate-slide-in-down animate-duration-250',
leaveActiveClass: 'animate-slide-out-up animate-duration-250',
})
</script>
<template>
<div class="h-96 flex flex-center">
<div class="flex flex-col items-center justify-center gap-3">
<!-- 开启relative -->
<div class="relative h-40 w-120 overflow-hidden border rounded-2xl">
<ObLoadingBox v-model="isLoad" mask-mode :transition-props>
<div class="h-10 w-full flex-center gap-3 bg-red">
docs
</div>
</ObLoadingBox>
</div>
<ObButton @click="isLoad = !isLoad">
更改加载状态
</ObButton>
</div>
</div>
</template>