admin-vben5/docs/src/components/layout-ui/page.md
Netfan 17c7ce8f21
feat: improve page component (#5013)
* feat: `page` component support fixed header

* docs: `page`  component documentation

* docs: Improve `props` types of `page`

* docs: improve `fixedHeader` description of `page`

* fix: `page` header border color with fixedHeader

* feat: add `headerClass` for `Page`
2024-12-04 21:40:41 +08:00

1.3 KiB

outline
deep

Page 常规页面组件

提供一个常规页面布局的组件,包括头部、内容区域、底部三个部分。

::: info 写在前面

本组件是一个基本布局组件。如果有更多的通用页面布局需求(比如双列布局等),可以根据实际需求自行封装。

:::

基础用法

Page作为你的业务页面的根组件即可。

Props

属性名 描述 类型 默认值
title 页面标题 string|slot -
description 页面描述(标题下的内容) string|slot -
contentClass 内容区域的class string -
headerClass 头部区域的class string -
footerClass 底部区域的class string -
autoContentHeight 自动调整内容区域的高度 boolean false
fixedHeader 固定头部在页面内容区域顶部,在滚动时保持可见 boolean false

::: tip 注意

如果titledescriptionextra三者均未提供有效内容(通过props或者slots均可),则页面头部区域不会渲染。

:::

Slots

插槽名称 描述
default 页面内容
title 页面标题
description 页面描述
extra 页面头部右侧
footer 页面底部