更新记录
1.0.1(2021-07-25) 下载此版本
更新文档
1.0.0(2021-07-25) 下载此版本
初始化
平台兼容性
tips
- 使用自定义导航栏在
pages.json
给所需页面添加"navigationStyle": "custom"
- 若使用透明导航栏需混入header.js,快速上手请参照示例项目
props 参数
参数名 | 介绍 | 默认值 |
---|---|---|
backgroundColor | 背景色 | #FFFFFF |
scrollTop | 页面传递过来距离顶部的高度(透明导航栏所需字段) | 0 |
defaultTextColor | 默认字体颜色 | #000000 |
transparent | 是否开启透明 | false |
transparentTextColor | 透明时文本颜色 | #FFFFFF |
transparentMaxHeight | 透明阈值,到指定高度取消透明 | 88 |
isOccupy | 是否留出导航栏高度 | true |
title | 导航标题(若设置则自定义无效) | - |
isBack | 是否需要返回按钮 | true |
使用示例:
普通导航栏
<chenmushan-custom-header title="自定义导航栏" />
透明导航栏(需要混入header.js)
<chenmushan-custom-header :scrollTop="SCROLLTOP" :isOccupy="false" :transparent="true" title="自定义导航栏"/>
自定义导航栏内容(需title为空)
<chenmushan-custom-header>
<text>自定义导航栏</text>
</chenmushan-custom-header>