PageHeader

用于页面的顶部，显示标题以及返回按钮。常用于二级、三级页面。

引用

import { regist, PageHeader, Button, ArrowLeftIcon } from "litos-ui";

regist(PageHeader);
regist([Button, ArrowLeftIcon]); // 如果需要显示返回按钮

演示

基础用法

通过 title-align 属性设置标题的对齐方式。分为：left、center。默认为: left

监听事件

通过监听 page-header 的 action 事件, 然后给任何子节点添加 l-action 属性, 点击子节点会自动触发 action 事件。

API

PageHeader Attibutes

参数	说明	类型	默认值
show-left	是否显示左边区域	boolean	true
show-right	是否显示右边区域	boolean	true
height	高度	string	-
border	是否显示底部边框	boolean	false
align	标题对齐方式	left、center	left
show-back	是否显示返回按钮	boolean	true
back-text	返回按钮文本	string	返回
page-title	标题	string	-
page-sub-title	副标题	string	-

PageHeader Slots

名称	说明
default	标题内容
left	左边区域内容
right	右边区域内容

PageHeader Events

事件名	说明	回调参数
click	点击按钮时触发	(event: Event)
action	点击子节点时触发, 子节点需要添加 l-action 属性, 通过 event.detail 获取 acton 以及 dataset	(event: CustomEvent)

PageHeader Methods

方法名	说明	类型
-	-	-

PageHeader CSS Variables

变量名	说明	默认值
-	-	-