# Avatar 头像

开发指南
- 快速上手
- 更新日志

基础组件

布局

导航

操作反馈

表单

其他

用来代表用户或事物，支持图片、图标或字符展示。

# 使用指南

在 page.json 中引入组件

"usingComponents": {
  "w-avatar": "wuss-weapp/w-avatar/index",
}

# 图片演示

# 代码演示

<w-pane title="Avatar" desc="头像" />

<w-pane desc="Default" />
<view class="pd" >
    <w-avatar size="small">W</w-avatar>
    <w-avatar>W</w-avatar>
    <w-avatar size="large">W</w-avatar>
</view>

<w-pane desc="Use src" />
<view class="pd" >
    <w-avatar size="small" src="/pages/assets/logo.png" />
    <w-avatar src="/pages/assets/logo.png" />
    <w-avatar size="large" src="/pages/assets/logo.png" />
</view>

<w-pane desc="Shape is square" />
<view class="pd" >
    <w-avatar size="small" scale shape="square">W</w-avatar>
    <w-avatar shape="square">W</w-avatar>
    <w-avatar shape="square" size="large">W</w-avatar>
</view>

<w-pane desc="Custom Style" />
<view class="pd" >
    <w-avatar size="small" wuss-class="custom1">W</w-avatar>
    <w-avatar wuss-class="custom2">W</w-avatar>
    <w-avatar wuss-class="custom3" size="large">W</w-avatar>
</view>

# API

# Attribute 属性

属性	说明	类型	默认值
size	设置头像的大小，可选值为 small、default、large	string	default
shape	指定头像的形状，可选值为 circle、square	string	circle
src	图片类头像的 src 地址	string	-

# Event 事件

事件名	说明	参数
bind:click	点击头像触发	-

# Slot 插槽

名称	说明
-	文本类头像自定义内容

# Class 自定义类名

类名	说明
wuss-class	根节点样式类

Edit this page

← Icon 图标 Steps 步骤条 →