Tabbar

Tabbar组件,也可以用来作为小程序的自定义Tabbar使用

代码引入

在 page.json 中引入组件

  1. {
  2. "usingComponents": {
  3. "mp-tabbar": "weui-miniprogram/tabbar/tabbar"
  4. }
  5. }

示例代码

属性列表

属性类型默认值必填说明
ext-classstring添加在组件内部结构的class,可用于修改组件内部的样式
listarray<object>Tabbar的项的数组,按照规范,至少要有2个Tabbar项
currentnumber0当前选中的Tabbar项的下标
bindchangeeventhandlerTabbar项发生改变的时候触发此事件,detail为{index, item},index是Tabbar下标,item是对应的Tabbar项的配置

list属性是对象数组,每一项表示一个Tabbar项,其字段含义为

字段名类型默认值必填说明
textstringTabbar项的标题
iconPathstringTabbar项的icon图片路径,建议使用绝对路径,相对路径要相对于组件所在目录的。
selectedIconPathstringTabbar项选中时的icon,建议使用绝对路径,相对路径要相对于组件所在目录的。
badgestring是否显示Tabbar的右上角的Badge