Avatar 头像
Avatar 组件可以用来代表人物或对象, 支持使用图片、图标或者文字作为 Avatar。
基础用法
使用
shape
和
size
属性来设置 Avatar 的形状和大小。
头像大小
图片的
size
也支持使用
string
类型来设置尺寸大小,例如:
xs
,
s
,
md
,
lg
。
展示类型
支持使用图片或者文字作为 Avatar。
图片加载失败时,可以使用
error
属性触发函数,默认触发图片填充效果。
当使用图片作为用户头像时,使用
object-fit
属性设置该图片如何在容器中展示。
Avatar API
Avatar 属性
| 属性 | 说明 | 类型 | 默认值 |
|---|---|---|---|
| src | 图片资源的路径 | string |
- |
| size | 尺寸大小 |
number
/
enum
|
50 |
| shape | 头像的形状 |
enum
|
circle |
| fit | 头像的填充效果 |
enum
|
cover |
Avatar 事件
| 名称 | 说明 | 回调参数 |
|---|---|---|
| error | 图片加载失败时触发 |
Function
|
Avatar 插槽
| 插槽名 | 说明 |
|---|---|
| default | 自定义默认内容 |