Skip to content

Avatar 头像 ​

用户头像展示,支持图片、文字缩略等多种形态。

基本用法 ​

通过 src 加载图片,加载失败时自动显示文字缩略。

UOJD张三
vue
<AAvatar alt="User One" />
<AAvatar alt="John Doe" />
<AAvatar alt="张三" />

尺寸 ​

支持 sm、md、lg 三种尺寸。

AAA
vue
<AAvatar alt="A" size="sm" />
<AAvatar alt="A" size="md" />
<AAvatar alt="A" size="lg" />

形状 ​

支持 circle(默认)和 square 两种形状。

CISQ
vue
<AAvatar alt="Circle" shape="circle" />
<AAvatar alt="Square" shape="square" />

自定义 fallback ​

通过 fallback 自定义文字。

UJD
vue
<AAvatar fallback="U" />
<AAvatar fallback="JD" />

API ​

Props ​

名称类型默认值说明
srcstring—图片地址
altstring—替代文本,也用于生成文字缩略
size'sm' | 'md' | 'lg''md'尺寸
shape'circle' | 'square''circle'形状
fallbackstring—自定义占位文字

MIT License