TuNavbar 导航栏
左箭头 / 文案、居中标题、右侧文案,clickLeft / clickRight 事件,可吸顶。
顶部导航栏:左侧箭头 / 文案、居中标题、右侧文案。点击左侧(箭头 / 文案区域)触发 clickLeft,右侧触发 clickRight。标题通过左右等宽占位实现严格居中。
属性
| 名称 | 类型 | 说明 |
|---|---|---|
title | string | 标题(居中)。 |
leftText | string | 左侧文案(配合返回箭头使用)。 |
showArrow | boolean | 是否显示返回箭头。 |
rightText | string | 右侧文案。 |
fixed | boolean | 固定顶部(吸顶,需父级留出占位高度)。 |
background | string | 背景色,默认 #ffffff。 |
border | boolean | 是否显示底部分隔线,默认 true。 |
事件:clickLeft、clickRight。
左侧点击 0 次 · 右侧点击 0 次 —— clickLeft / clickRight 事件回传父级。
实例
ts
createComponent({
component: TuNavbar,
props: { title: '订单详情', leftText: '返回', showArrow: true, rightText: '分享' },
emitters: {
clickLeft: () => this.goBack(),
clickRight: () => this.share(),
},
})