"tabBar": {
"color": "#999999",
"selectedColor": "#FFEB60",
"borderStyle": "white",
"backgroundColor": "#fff",
"list": [
{
"text": "首页",
"pagePath": "pages/index/index",
"iconPath": "images/icon_home.png",
"selectedIconPath": "images/icon_home_active.png"
},
{
"text": "商家",
"pagePath": "pages/merchant/merchant-entry/merchant-entry",
"iconPath": "images/icon_add.png",
"selectedIconPath": "images/icon_add.png"
},
{
"text": "消息",
"pagePath": "pages/user/information/information",
"iconPath": "images/icon_order.png",
"selectedIconPath": "images/icon_order_active.png"
},
{
"text": "我的",
"pagePath": "pages/user/user",
"iconPath": "images/icon_user.png",
"selectedIconPath": "images/icon_user_active.png"
}
]
},
上面是代码,tabar相关属性
属性 | 类型 | 必填 | 默认值 | 描述 |
---|---|---|---|---|
color | HexColor | 是 | tab 上的文字默认颜色 | |
selectedColor | HexColor | 是 | tab 上的文字选中时的颜色 | |
backgroundColor | HexColor | 是 | tab 的背景色 | |
borderStyle | String | 否 | black | tabbar上边框的颜色, 仅支持 black/white |
list | Array | 是 | tab 的列表,详见 list 属性说明,最少2个、最多5个 tab | |
position | String | 否 | bottom | 可选值 bottom、top |
tabBar list定义说明:
属性 | 类型 | 必填 | 说明 |
---|---|---|---|
pagePath | String | 是 | 页面路径,必须在 pages 中先定义 |
text | String | 是 | tab 上按钮文字 |
iconPath | String | 是 | 图片路径,icon 大小限制为40kb,建议尺寸为 81px * 81px |
selectedIconPath | String | 是 | 选中时的图片路径,icon 大小限制为40kb,建议尺寸为 81px * 81px |
tabBar 是一个数组,能配置最少2个、最多5个 tab