原生小程序开发 API｜界面 Tab Bar API 汇总（一）

ty.showTabBar

显示 tabBar

需引入MiniKit，且在>=2.0.0版本才可使用

参数

Object object

属性	类型	必填	说明
animation	`boolean`	是	是否需要动画效果
complete	`function`	否	接口调用完成的回调函数（成功或失败都会调用）
success	`function`	否	接口调用成功的回调函数
fail	`function`	否	接口调用失败的回调函数

函数定义示例

/**
 * 显示 tabBar
 */
export function showTabBar(params: {
  /** 是否需要动画效果 */
  animation: boolean;
  complete?: () => void;
  success?: (params: null) => void;
  fail?: (params: {
    errorMsg: string;
    errorCode: string | number;
    innerError: {
      errorCode: string | number;
      errorMsg: string;
    };
  }) => void;
}): void;

ty.hideTabBar

隐藏 tabBar

需引入MiniKit，且在>=2.0.0版本才可使用

参数

Object object

属性	类型	必填	说明
animation	`boolean`	是	是否需要动画效果
complete	`function`	否	接口调用完成的回调函数（成功或失败都会调用）
success	`function`	否	接口调用成功的回调函数
fail	`function`	否	接口调用失败的回调函数

函数定义示例

/**
 * 隐藏 tabBar
 */
export function hideTabBar(params: {
  /** 是否需要动画效果 */
  animation: boolean;
  complete?: () => void;
  success?: (params: null) => void;
  fail?: (params: {
    errorMsg: string;
    errorCode: string | number;
    innerError: {
      errorCode: string | number;
      errorMsg: string;
    };
  }) => void;
}): void;

👉 立即免费领取开发资源，体验涂鸦 MiniApp 小程序开发。

ty.setTabBarBadge

为 tabBar 某一项的右上角添加文本

需引入MiniKit，且在>=2.0.0版本才可使用

参数

Object object

属性	类型	必填	说明
index	`number`	是	tabBar 的哪一项，从左边算起
text	`string`	是	显示的文本，超过 4 个字符则显示成 ...
complete	`function`	否	接口调用结束的回调函数（调用成功、失败都会执行）
success	`function`	否	接口调用成功的回调函数
fail	`function`	否	接口调用失败的回调函数

函数定义示例

/**
 * 为 tabBar 某一项的右上角添加文本
 */
export function setTabBarBadge(params: {
  /** tabBar 的哪一项，从左边算起 */
  index: number;
  /** 显示的文本，超过 4 个字符则显示成 ... */
  text: string;
  complete?: () => void;
  success?: (params: null) => void;
  fail?: (params: {
    errorMsg: string;
    errorCode: string | number;
    innerError: {
      errorCode: string | number;
      errorMsg: string;
    };
  }) => void;
}): void;

ty.setTabBarItem

动态设置 tabBar 某一项的内容

需引入MiniKit，且在>=2.0.0版本才可使用

参数

Object object

属性	类型	必填	说明
index	`number`	是	tabBar 的哪一项，从左边算起
text	`string`	是	tab 上的按钮文字
iconPath	`string`	是	图片路径
selectedIconPath	`string`	是	选中时的图片路径
complete	`function`	否	接口调用完成的回调函数（成功失败都会回调）
success	`function`	否	接口调用成功的回调函数
fail	`function`	否	接口调用失败的回调函数

函数定义示例

/**
 * 动态设置 tabBar 某一项的内容
 */
export function setTabBarItem(params: {
  /** tabBar 的哪一项，从左边算起 */
  index: number;
  /** tab 上的按钮文字 */
  text: string;
  /** 图片路径 */
  iconPath: string;
  /** 选中时的图片路径 */
  selectedIconPath: string;
  complete?: () => void;
  success?: (params: null) => void;
  fail?: (params: {
    errorMsg: string;
    errorCode: string | number;
    innerError: {
      errorCode: string | number;
      errorMsg: string;
    };
  }) => void;
}): void;

👉 立即免费领取开发资源，体验涂鸦 MiniApp 小程序开发。