Badge:新事件标记组件,在组件上提供事件信息展示能力
Badge(value: {count: number, position?: BadgePosition, maxCount?: number, style?: BadgeStyle})
count:设置提醒消息数
position:设置提示点显示位置(BadgePosition)
BadgePosition:RightTop(圆点显示在右上角),Right(圆点显示在右侧纵向居中),Left(圆点显示在左侧纵向居中)
maxCount:最大消息数,超过最大消息时仅显示maxCount+
style:Badge组件可设置样式,支持设置文本颜色、尺寸、圆点颜色和尺寸(BadgeStyle)
BadgeStyle:
color 文本颜色
fontSize 文本大小
badgeSize badge的大小
badgeColor badge的颜色
效果如图:
代码:
@Entry
@Component