头像 Avatar ​

以图片、图标、文字的形式展现头像

基础用法 ​

基础使用，设置头像为文本或着图片信息。

<template>
  <bp-space>
    <bp-avatar>Sam</bp-avatar>
    <bp-avatar img-src="https://cos.moya.plus/avatar/avatar_sam.jpg"></bp-avatar>
  </bp-space>
</template>

头像尺寸 ​

提供四种头像尺寸以适应不同使用场景，分别是mini - 迷你，small - 小型，normal - 常规，large - 大型。

<template>
  <bp-space>
    <bp-avatar v-for="v in sizes" :size="v">Sam</bp-avatar>
  </bp-space>
</template>

<script setup lang="ts">
const sizes = ['mini', 'small', 'normal', 'large'];
</script>

Avatar 属性 ​

img-src
图片资源地址
String
-
size
头像尺寸
Enum
normal
shape
按钮形状
Enum
square
fit
图片适应类型
Enum
normal

Avatar 事件 ​

click
点击触发
none