Avatar 头像

用图标、图片或者字符的形式展示用户或事物信息。

基本用法

通过 shape 和 size 设置头像的形状和大小。

展示类型

图片如何适应容器框

颜色

头像组

人多不一定是好事。

加载失败时显示的图像

API

属性

属性名	说明	类型	默认值	备注
size	头像的尺寸	'large' | 'default' | 'small'	—
src	头像的地址	string	—
alt	描述图像的替换文本	string
shape	设置头像的形状	'circle'|'square'	circle
icon	设置头像的图标类型，参考 Icon 组件	string
fit	图片在容器内的的适应类型	boolean	false
fallback-src	头像加载失败时显示的图片的地址	string	''
lazy	是否让图片进入视口再加载	boolean	false	开发中

Avatar Events

属性名	说明	类型
error	图片加载失败时触发	(e: Event) => void

AvatarGroup

属性名	说明	类型	默认值	备注
max	组内头像显示的最大个数	number	undefined
options	头像组内头像的配置项，每一项都是一个对象	Array	[]

Avatar Slots

名称	参数	说明
default	()	自定义头像展示内容

AvatarGroup Slots

名称	参数	说明
avatar	(info: { option: { [key: string]: any } })	头像组头像
default	()	头像组内填充的内容
rest	(info: { options: Array<{ [key: string]: any }>, rest: number })	头像组溢出容器