组件
卡片
显示带有标题、主体和页脚的内容卡片。
用法
<template>
<UCard>
<template #header>
<Placeholder class="h-8" />
</template>
<Placeholder class="h-32" />
<template #footer>
<Placeholder class="h-8" />
</template>
</UCard>
</template>
插槽
页眉
使用 #header
插槽填充页眉。
页脚
使用 #footer
插槽填充页脚。
属性
ui
{ base?: string; background?: string; divide?: string; ring?: string; rounded?: string; shadow?: string; body?: DeepPartial<{ base: string; background: string; padding: string; }, any>; header?: DeepPartial<...>; footer?: DeepPartial<...>; } & { ...; } & { ...; }
{}
as
字符串
"div"
配置
{
base: '',
background: 'bg-white dark:bg-gray-900',
divide: 'divide-y divide-gray-200 dark:divide-gray-800',
ring: 'ring-1 ring-gray-200 dark:ring-gray-800',
rounded: 'rounded-lg',
shadow: 'shadow',
body: {
base: '',
background: '',
padding: 'px-4 py-5 sm:p-6'
},
header: {
base: '',
background: '',
padding: 'px-4 py-5 sm:px-6'
},
footer: {
base: '',
background: '',
padding: 'px-4 py-4 sm:px-6'
}
}