feat(tabbar): 添加徽章显示限制和设置方法

限制徽章数字显示最大为99+,并添加设置徽章的方法
This commit is contained in:
feige996
2025-08-24 16:11:32 +08:00
parent b184adc9a3
commit b05e0b8ec3
3 changed files with 9 additions and 3 deletions

View File

@@ -46,13 +46,16 @@ export const nativeTabbarList: NativeTabBarItem[] = [
},
]
// badge 显示一个数字或 小红点(样式可以直接在 tabbar/index.vue 里面修改)
export type CustomTabBarItemBadge = number | 'dot'
export interface CustomTabBarItem {
text: string
pagePath: string
iconType: 'uniUi' | 'uiLib' | 'unocss' | 'iconfont' | 'image' // 不建议用 image 模式需要配置2张图
icon: any // 其实是 string 类型,这里是为了避免 ts 报错 (tabbar/index.vue 里面 uni-icons 那行)
iconActive?: string // 只有在 image 模式下才需要传递的是高亮的图片PS 不建议用 image 模式)
badge?: number | 'dot' // badge 显示一个数字或 小红点(样式可以直接在 tabbar/index.vue 里面修改)
badge?: CustomTabBarItemBadge
isBulge?: boolean // 是否是中间的鼓包tabbarItem
}
// TODO: 3/3. 使用 CUSTOM_TABBAR(2,3) 时,更新下面的 tabbar 配置