Blame view

Yi.Vben5.Vue3/docs/src/components/layout-ui/page.md 1.28 KB
515fceeb   “wangming”   框架初始化
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
  ---
  outline: deep
  ---
  
  # Page 常规页面组件
  
  提供一个常规页面布局的组件,包括头部、内容区域、底部三个部分。
  
  ::: info 写在前面
  
  本组件是一个基本布局组件。如果有更多的通用页面布局需求(比如双列布局等),可以根据实际需求自行封装。
  
  :::
  
  ## 基础用法
  
  `Page`作为你的业务页面的根组件即可。
  
  ### Props
  
  | 属性名 | 描述 | 类型 | 默认值 | 说明 |
  | --- | --- | --- | --- | --- |
  | title | 页面标题 | `string\|slot` | - | - |
  | description | 页面描述(标题下的内容) | `string\|slot` | - | - |
  | contentClass | 内容区域的class | `string` | - | - |
  | headerClass | 头部区域的class | `string` | - | - |
  | footerClass | 底部区域的class | `string` | - | - |
  | autoContentHeight | 自动调整内容区域的高度 | `boolean` | `false` | - |
  
  ::: tip 注意
  
  如果`title`、`description`、`extra`三者均未提供有效内容(通过`props`或者`slots`均可),则页面头部区域不会渲染。
  
  :::
  
  ### Slots
  
  | 插槽名称    | 描述         |
  | ----------- | ------------ |
  | default     | 页面内容     |
  | title       | 页面标题     |
  | description | 页面描述     |
  | extra       | 页面头部右侧 |
  | footer      | 页面底部     |