更新记录

0.1.1（2026-07-31） 下载此版本

  • 移除第三方组件库参考表述，完善独立组件文档。

平台兼容性

uni-app x(4.25)

Chrome Safari Android iOS 鸿蒙 微信小程序
√ √ √ - √ √

其他

多语言 暗黑模式 宽屏模式
× √ ×

nax-badge

uni-app x 徽标组件，提供常用能力。

依赖

  • nax-ui-theme（CSS 变量 --nax-*）

基础用法

<!-- 锚定在内容右上角 -->
<nax-badge value="8">
  <view class="box"></view>
</nax-badge>

<!-- 红点 -->
<nax-badge dot>
  <view class="box"></view>
</nax-badge>

<!-- 独立展示 -->
<nax-badge alone value="99+"></nax-badge>

Props

属性 类型 默认 说明
value string '' 显示值；数字超过 max 显示 {max}+
max number 0 最大值，0 表示不限制
dot boolean false 红点模式
show-zero boolean false 值为 0 时是否展示
show boolean true 是否显示徽标
processing boolean false 处理中波纹
alone boolean false 独立展示（非角标定位）
type string default default / success / error / warning / info
color string '' 自定义颜色，覆盖 type
offset-x string '' 水平偏移，正值向右
offset-y string '' 垂直偏移，正值向下
custom-class string '' 根节点扩展 class

插槽

名称 说明
default 被徽标锚定的内容
value 自定义徽标内容

平台说明

  • processing 动画：Web / 小程序使用 CSS @keyframes；App（Android / iOS / Harmony）使用 JS 定时 transform/opacity 波纹（条件编译隔离，对齐 nax-button loading）。

隐私、权限声明

1. 本插件需要申请的系统权限列表：

无

2. 本插件采集的数据、发送的服务器地址、以及数据用途说明：

无

3. 本插件是否包含广告，如包含需详细说明广告表达方式、展示频率：

无

许可协议

MIT协议
评论列表 撰写评论 向官方投诉

暂无用户评论。