微信小程序API tabBar
2022-05-09 17:06 更新
wx.showTabBarRedDot(Object object)
基础库 1.9.0 开始支持,低版本需做兼容处理。
显示 tabBar 某一项的右上角的红点
参数
Object object
属性 | 类型 | 默认值 | 必填 | 说明 |
---|---|---|---|---|
index | number | 是 | tabBar 的哪一项,从左边算起 | |
success | function | 否 | 接口调用成功的回调函数 | |
fail | function | 否 | 接口调用失败的回调函数 | |
complete | function | 否 | 接口调用结束的回调函数(调用成功、失败都会执行) |
wx.showTabBar(Object object)
基础库 1.9.0 开始支持,低版本需做兼容处理。
显示 tabBar
参数
Object object
属性 | 类型 | 默认值 | 必填 | 说明 |
---|---|---|---|---|
animation | boolean | false | 否 | 是否需要动画效果 |
success | function | 否 | 接口调用成功的回调函数 | |
fail | function | 否 | 接口调用失败的回调函数 | |
complete | function | 否 | 接口调用结束的回调函数(调用成功、失败都会执行) |
wx.setTabBarStyle(Object object)
基础库 1.9.0 开始支持,低版本需做兼容处理。
动态设置 tabBar 的整体样式
参数
Object object
属性 | 类型 | 默认值 | 必填 | 说明 |
---|---|---|---|---|
color | string | 否 | tab 上的文字默认颜色,HexColor | |
selectedColor | string | 否 | tab 上的文字选中时的颜色,HexColor | |
backgroundColor | string | 否 | tab 的背景色,HexColor | |
borderStyle | string | 否 | tabBar上边框的颜色, 仅支持 black/white | |
success | function | 否 | 接口调用成功的回调函数 | |
fail | function | 否 | 接口调用失败的回调函数 | |
complete | function | 否 | 接口调用结束的回调函数(调用成功、失败都会执行) |
示例代码
wx.setTabBarStyle({
color: '#FF0000',
selectedColor: '#00FF00',
backgroundColor: '#0000FF',
borderStyle: 'white'
})
wx.setTabBarItem(Object object)
基础库 1.9.0 开始支持,低版本需做兼容处理。
动态设置 tabBar 某一项的内容,2.7.0 起图片支持临时文件和网络文件。
参数
Object object
属性 | 类型 | 默认值 | 必填 | 说明 |
---|---|---|---|---|
index | number | 是 | tabBar 的哪一项,从左边算起 | |
text | string | 否 | tab 上的按钮文字 | |
iconPath | string | 否 | 图片路径,icon 大小限制为 40kb,建议尺寸为 81px * 81px,当 postion 为 top 时,此参数无效 | |
selectedIconPath | string | 否 | 选中时的图片路径,icon 大小限制为 40kb,建议尺寸为 81px * 81px ,当 postion 为 top 时,此参数无效 | |
success | function | 否 | 接口调用成功的回调函数 | |
fail | function | 否 | 接口调用失败的回调函数 | |
complete | function | 否 | 接口调用结束的回调函数(调用成功、失败都会执行) |
示例代码
wx.setTabBarItem({
index: 0,
text: 'text',
iconPath: '/path/to/iconPath',
selectedIconPath: '/path/to/selectedIconPath'
})
wx.setTabBarBadge(Object object)
基础库 1.9.0 开始支持,低版本需做兼容处理。
为 tabBar 某一项的右上角添加文本
参数
Object object
属性 | 类型 | 默认值 | 必填 | 说明 |
---|---|---|---|---|
index | number | 是 | tabBar 的哪一项,从左边算起 | |
text | string | 是 | 显示的文本,超过 4 个字符则显示成 ... | |
success | function | 否 | 接口调用成功的回调函数 | |
fail | function | 否 | 接口调用失败的回调函数 | |
complete | function | 否 | 接口调用结束的回调函数(调用成功、失败都会执行) |
示例代码
wx.setTabBarBadge({
index: 0,
text: '1'
})
wx.removeTabBarBadge(Object object)
基础库 1.9.0 开始支持,低版本需做兼容处理。
移除 tabBar 某一项右上角的文本
参数
Object object
属性 | 类型 | 默认值 | 必填 | 说明 |
---|---|---|---|---|
index | number | 是 | tabBar 的哪一项,从左边算起 | |
success | function | 否 | 接口调用成功的回调函数 | |
fail | function | 否 | 接口调用失败的回调函数 | |
complete | function | 否 | 接口调用结束的回调函数(调用成功、失败都会执行) |
wx.hideTabBarRedDot(Object object)
基础库 1.9.0 开始支持,低版本需做兼容处理。
隐藏 tabBar 某一项的右上角的红点
参数
Object object
属性 | 类型 | 默认值 | 必填 | 说明 |
---|---|---|---|---|
index | number | 是 | tabBar 的哪一项,从左边算起 | |
success | function | 否 | 接口调用成功的回调函数 | |
fail | function | 否 | 接口调用失败的回调函数 | |
complete | function | 否 | 接口调用结束的回调函数(调用成功、失败都会执行) |
wx.hideTabBar(Object object)
基础库 1.9.0 开始支持,低版本需做兼容处理。
隐藏 tabBar
参数
Object object
属性 | 类型 | 默认值 | 必填 | 说明 |
---|---|---|---|---|
animation | boolean | false | 否 | 是否需要动画效果 |
success | function | 否 | 接口调用成功的回调函数 | |
fail | function | 否 | 接口调用失败的回调函数 | |
complete | function | 否 | 接口调用结束的回调函数(调用成功、失败都会执行) |
以上内容是否对您有帮助:
更多建议: