---
title: Avatar 头像
description: 用图标、图片、字符的形式展示用户或事物信息
isComponent: true
usage: { title: "", description: "" }
spline: data,
author: 肖恒
---

### 基本用法

提供了 3 种不同类型的头像：图标头像，图片头像，字符头像。分别通过 `icon`，`image` 支持属性
和插槽方式。

**字符头像**：可通过插槽 `default`，`content`来进行设置，属性值为：`String`，`Function`。

**图片头像**：只能通过`image`属性设置，并且只能为`String`。

**图标头像**：可通过`icon`属性或者插槽来设置，并且属性类型必须为`Function`。

{{ base }}

### 头像形状

通过属性`shape`可设置头像的形状，可选：`round`，`circle`，默认为：`circle`。

{{ shape }}

### 头像大小

通过`size`可设置头像大小，默认支持三种大小：`small`、`medium`、`large`，也可自行定义大小，例如：`120px`。

{{ size }}

### 字符头像大小自适应

头像支持字符自适应，即字符长度过长时，头像可自动调整字符以便呈现完整内容

{{ adjust }}

### 组合头像

多个头像可通过`l-avatar-group`进行合并成为一个头像组合。

{{ group }}

### 组合头像偏移方向

可通过`cascading`来设置头像偏移方向，可选：`left-up`，`right-up`，默认为：`left-up`。

{{ group-cascading }}

### 组合头像个数

在头像组合较多的时候可通过`max`来设置最多显示头像的个数，建议最多不多于`50`。通过`collapseAvatar`可设置最右侧折叠元素，
默认为`+n`，也可通过函数属性或者插槽来自定义。

{{ group-max }}
