顶部导航
适用场景#
用于实现常规的页面顶部导航效果，预置返回首页与返回按钮
基础能力说明#
通过属性栏配置可快速实现页面的顶部导航效果，同时该组件提供了「返回按钮、返回首页按钮」属性，开启后，可直接生成展示相关导航功能
扩展场景说明#
小程序样式兼容要求#
小程序使用时，需在页面设置-页面样式-小程序导航中奖导航栏样式切换为「自定义样式」，否则小程序页面上方会显示出 2 个导航栏，同时导航栏中间会留有不可消除的空白间距
属性介绍#
组件接收的外部传入的属性
属性名 | 属性标识 | 类型 | 属性分组 | 默认值 | 说明 |
|---|
| 导航标题 | title | string | 基础属性 | "导航标题" | 设置导航组件的标题文本内容 |
| 按钮主题 | iconTheme | {"label":"黑色","value":"black"}|{"label":"白色","value":"white"} | 基础属性 | "black" | 设置导航组件按钮的主题颜色 |
| 背景色 | backgroundColor | string | 基础属性 | "rgba(255, 255, 255, 1)" | 设置导航组件的背景颜色 |
| 字体颜色 | textColor | string | 基础属性 | "rgba(0, 0, 0, 1)" | 设置导航组件的标题文本颜色 |
| 标题字号 | textSize | number | 基础属性 | 28 | 设置导航组件的标题字体大小 |
| 返回按钮 | back | boolean | 基础属性 | true | 开启后，导航组件会生成返回按钮，可通过事件配置区的back触发条件进行相关事件配置 |
| 返回首页按钮 | home | boolean | 基础属性 | true | 开启后，导航组件会生成首页按钮，可通过事件配置区的home触发条件进行相关事件配置 |
| 渲染模式 | mode | "default"|"cover" | 高级属性 | "default" | default: 默认方式，内容从navbar下渲染。cover: 封面模式，封面模式下APP内容从视窗最顶部渲染 |
事件介绍#
组件暴露的事件，可以监听组件的事件来触发一些外部的动作
事件名 | 事件code | 事件出参 event.detail | 适用情况 | 说明 |
|---|
| 返回事件 | back | 兼容三端 | - | |
| 返回首页 | home | 兼容三端 | - |