yun-avatar

yun-avatar 头像

介绍

个人中心小头像

使用方法

import "../../components/yun-avatar/yun-avatar.stml";

例子

    <yun-avatar
        size="large"
        font="蓝"
        font-color="red"
        @avatar="taps"
    />

    <yun-avatar 
        size="small"
        font="L"
    />

    <yun-avatar
        size="large"
        shape="square"
        bg-icon="../../components/yun-avatar/asset/yun.jpg"
        
    />

    <yun-avatar 
        size="normal"
        shape="square"
        bg-icon="../../components/yun-avatar/asset/yun.jpg"
    />

    data() {
        return {
           
        };
    },
    taps(e){
        console.log(JSON.stringify(e));
    }

props 属性

参数 说明 类型 默认值 参数
id 唯一标识，必填 String -
size 头像尺寸，选填 String normal small normal large
shape 头像类型，选填 String round square 方形 round 圆形
bg-color 头像背景色，选填 String #12abe7
bg-icon 头像图片路径，选填 Number - 可以使用本地路径和网络路径
font 头像内展示文字，选填 String - 一个字符（头像图片存在时，该字段不生效）
font-color 文字颜色，选填 String #fff （头像图片存在时，该字段不生效）

events 事件

事件名 说明 回调参数
avatar 点击头像时触发 返回当前头像ID
是否仍需要帮助？ 请保持联络！
最后更新于 2024/11/18