@mas.io/adc-nav-bar

安装

tnpm install --save @alipay/adc-nav-bar

组件介绍

能力中心小程序索导航栏组件，可自定义导航栏样式，满足业务需求，使用时需添加"transparentTitle": "always"。

参数说明

属性	必填	参数类型	参数说明	默认值	示例
className	否	string	自定义样式	-	-
title	否	string	导航栏标题	-	首页
align	否	string	justify-content对齐方式	flex-start	flex-end
fill	否	boolean	是否填充头部	true	false
isBack	否	boolean	是否需要返回按钮	true	false
useSlot	否	boolean	是否自定义标题	false	true
fontSize	否	string	字体大小	32rpx	36rpx
color	否	string	字体颜色	#fff	#000
zIndex	否	string	z-index	''	9
onCallback	否	Function	navbar加载完成回调，返回navbar高度	null	(e)=>{}
onTitleBarTap	否	Function	点击navbar	#null	(e)=>{}
background	否	string	背景颜色	linear-gradient(246deg, #FADC0F 0%, #FA8C12 100%, #FA8C12 100%)	#fff
backBtnColor	否	string	设置返回按钮颜色	''	#fff

在小程序中使用

{
  "usingComponents": {
    "mas-adc-nav-bar": "@alipay/adc-nav-bar/es/index"
  }
}

在 page.axml 中引用组件

<!-- 页面使用方式 -->
<adc-nav-bar title="标题" isBack="{{false}}" background="{{background}}"></adc-nav-bar>
<view>
  这是文本内容....
</view>

Badges

---