---
url: /components/basic/FaAvatar.md
---
# FaAvatar 头像

用户头像组件，支持图片加载失败时显示降级内容。

## 使用场景

* 用户头像显示
* 评论区头像
* 聊天消息头像
* 团队成员展示
* 个人中心头像
* 头像上传预览

## Props

| 属性 | 类型 | 默认值 | 说明 |
|------|------|--------|------|
| `src` | `string` | **必需** | 头像图片 URL |
| `fallback` | `string` | - | 图片加载失败时显示的文本（默认取前 2 个字符） |
| `class` | `HTMLAttributes['class']` | - | 自定义 CSS 类 |

## Slots

| 名称 | 说明 |
|------|------|
| `default` | 自定义降级内容（覆盖 fallback） |

## 注意事项

1. **图片加载失败**：当图片加载失败时，会自动显示 `fallback` 文本或自定义 slot 内容
2. **默认尺寸**：头像默认尺寸由 CSS 类控制，可通过 `class` 属性调整
3. **形状**：默认为圆角方形，添加 `rounded-full` 类可变为圆形
4. **降级文本**：`fallback` 默认只显示前 2 个字符