swan.setTabBarBadge

解释:为 tabBar 某一项的右上角添加文本,可以使用底部标签栏徽标(TabBarBadge)进行提示,告知用户对应的标签页中有内容更新。

方法参数

Object object

object 参数说明

属性名类型必填默认值说明

index

Number

tabBar 的哪一项,从左边算起

text

String

显示的文本,超过 3 个字符则显示成 “……”

success

Function

接口调用成功的回调函数

fail

Function

接口调用失败的回调函数

complete

Function

接口调用结束的回调函数(调用成功、失败都会执行)

示例

跳转编辑工具

在开发者工具中打开

在 WEB IDE 中打开

扫码体验

代码示例

百度智能小程序

请使用百度APP扫码

图片示例

swan.setTabBarBadge - 图2

代码示例

  • SWAN
  • JS
  1. <view class="wrap">
  2. <button type="primary" bindtap="setTabBarBadge">
  3. {{ !hasSetTabBarBadge ? '设置tab徽标' : '移除tab徽标' }}
  4. </button>
  5. </view>

设计指南

不建议底部标签栏同时出现多个徽标或红点;用户查看更新内容后,应即时移除徽标和红点。
徽标文本(text)不能超过 3 个字符(中文、字母或数字),否则将显示错误。

swan.setTabBarBadge - 图3

错误

多个飘新同时出现,导致用户注意力被分散。

swan.setTabBarBadge - 图4

错误

徽标文本设置为数字1000,显示成“…”。

错误码

Android

错误码说明

1001

执行失败

iOS

错误码说明

202

解析失败,请检查参数是否正确

1001

当前页面不含 tabbar