Skip to content

头像

Avatar Props ​

名称类型默认值说明
srcstring-头像的主图片地址。
fallbackSrcstring-主图片加载失败时改用的备用图片地址。
namestring-用户名,用于生成首字母回退文字和无障碍标签。
altstring-头像的无障碍标签,设置后优先于 name 作为朗读文本。
sizeAvatarSize'md'头像尺寸,支持命名尺寸或像素数值。命名尺寸见下表。
shapeAvatarShape'circle'头像形状,可选 circle、rounded、square。

命名尺寸 ​

名称像素值
xsm20px
sm24px
md36px
lg48px
xl128px

像素尺寸 ​

AvatarSize 类型列出了常用的像素值,便于获得类型提示和自动补全:

16 | 20 | 24 | 32 | 36 | 40 | 48 | 60 | 64 | 72 | 96 | 128 | 144 | 180

组件本身并不限制只能使用这些数值。如果传入列表外的数字,头像仍会按该像素值渲染。

Avatar 插槽 ​

名称说明
default替代默认人物图标的自定义内容。仅在无图片且无姓名时生效。
status头像角落的状态指示器,通常放置 AvatarStatusDot。

Avatar 事件 ​

名称说明
error主图片加载失败时触发。

AvatarStatusDot Props ​

名称类型默认值说明
variantAvatarStatusDotVariant'neutral'状态点颜色变体:neutral、info、success、warning、error。

原生属性 ​

根元素为 <span>。

以下内容传入根元素:

  • HTML 属性。
  • aria-* 属性。
  • data-* 属性。
  • class。
  • style。