# fine-avatar

fine-avatar 头像，这种东西还是经常碰见的，有喜欢方的，也有喜欢圆的

## Props

<!-- @vuese:fine-avatar:props:start -->
|Name|Description|Type|Required|Default|
|---|---|---|---|---|
|src|头像链接|`String`|`false`|`-`|
|size|头像大小|`String | Number`|`false`|`80`|
|mode|头像图片显示模式|`String`|`false`|`scaleToFill`|
|shape|头像显示形状|`'circle' | 'square'`|`false`|`circle`|
|radius|头像圆角值，`shape`为`square`时生效|`String | Number`|`false`|`8`|
|lazy|是否懒加载头像|`Boolean`|`false`|`false`|
|webp|在系统不支持webp的情况下是否单独启用webp|`Boolean`|`false`|`false`|
|text|文字头像内容|`String`|`false`|`-`|
|textSize|文字头像文字大小|`String | Number`|`false`|`32`|
|textColor|文字头像文字颜色|`String`|`false`|`-`|
|textWeight|文字头像文字粗细|`String`|`false`|`-`|
|background|头像背景颜色|`String`|`false`|`-`|
|margin|头像外边距|`String | Number`|`false`|`-`|
|params|自定义事件参数，会通过所有事件回传|`String | Number`|`false`|`-`|
|unit|组件整体显示单位|`'rpx' | 'px'`|`false`|`rpx`|
|theme|组件主题，支持自定义|`'light' | 'dark'`|`false`|`light`|
|customStyle|组件自定义样式|`String | Object`|`false`|`-`|

<!-- @vuese:fine-avatar:props:end -->


## Events

<!-- @vuese:fine-avatar:events:start -->
|Event Name|Description|Parameters|
|---|---|---|
|click|头像点击事件|`{ src, params }`|
|load|头像加载完成|`{ src, params, event }`|
|error|头像加载失败|`{ src, params, event }`|

<!-- @vuese:fine-avatar:events:end -->


## Slots

<!-- @vuese:fine-avatar:slots:start -->
|Name|Description|Default Slot Content|
|---|---|---|
|default|默认内容插槽|-|
|loading|加载时内容插槽|-|
|error|加载错误内容插槽|-|

<!-- @vuese:fine-avatar:slots:end -->


## MixIns

<!-- @vuese:fine-avatar:mixIns:start -->
|MixIn|
|---|
|undefined|

<!-- @vuese:fine-avatar:mixIns:end -->


